Styling amazon affliate links

user_13569082 0
Viewed 762

I have a page where multiple amazon affiliate links will be displayed on the page like so.

{amazon.map((amazon) => (
          <div className="col-sm-4" key={amazon.link}>
             <iframe
              style={{height: '300px', width: '300px'}}
              marginwidth="0"
              marginheight="0"
              scrolling="no"
              frameborder="0"
              src={amazon.link}
            ></iframe>
          </div>
        ))}

This is working fine, (the links are stored in a json file). However when I try to make the thumbnails of the images larger, the images stays the same size and the width/height between the affiliate items grows larger. like so

How am I able to style the products? Thank you in advance.
Just in case it's needed:

github repo

amazon-product-api reactjs iframe css html
1 Answers

You won't be able to edit what's inside of the iframe since an iframe is rendering amazon's web page which you do not have control over. A way to work around this would be to manually create the product card yourself instead of using amazon's provided iframe. Amazon affiliate provides a plain URL link you could use to build your own card.

user_98776200
Related