Responsive design of a product card component

It actually looks good for me on Firefox for Android! Wish I had an iPhone to test it on and see the issue myself.

Some other things worth noting though, practicing semantic HTML is always a good thing to do. This is just a small component so there's not a ton of use for semantic tags, but one major one is that the <div> with the .main-container class should maybe be an <article> instead. Using semantic tags instead of regular <div>'s when applicable is great for people using screen readers.

Here's an article on semantic tags!

Also it's generally good practice to avoid !important in CSS. Try using a more specific selector instead when possible.