Product preview card component

You actually did a wonderful job on the challenge. The best way to get the hang of it all is to keep practicing and don't be afraid to make mistakes - you can learn a lot from mistakes.

If you put a width on the parent (image-card) the image will only be 100% of the parent. I didn't see a width for the parent in your code. This is one solutions for stopping the image from crushing the white box.

Keep on coding you have a real knack for it. All the best to you!

hi there! 👋

a few layout tips:

• you can set your paddings and margins using rem and em as well, this way these values will scale up with the font-size, when you increase them in @media queries
• use line-height without parameters, so the element's line height will adapt to its font-size -when centering the content using Flexbox on the body it's better to use min-height. using height: 100vh will prevent users scrolling down on smaller screen sizes even if your content overflowing.

Hope this helps 🙏

Good luck and happy coding! 💪