Product preview card component

Hey there, Catherine Is Online! 👋

Great job on this challenge! 👏 Your solution looks good and responds well! 🙌

One thing I'd suggest is to probably not set the font-size of the text in the body in px because we typically want to users to be able to change the size of all text on the site by the changing the root font-size of the document. In other words, setting font-size in em or rem wherever possible would be the better way to go in order to make your solution as accessible as possible. 😉

Hope that helps. 😊

Keep coding (and happy coding, too)! 😁

Hey @catherineisonline, remove height: 450px; from main element.

Very cool and clean. It almost looks like the design is a screenshot of your implementation.

Well good job ! Just may be use bold propertie for promo price :) Friendly, DkP

Looks spot on! Great job 👍

Hi, I think the only suggestion I can give you is to set the font size on HTML or body to 62.5%, this makes 1rem = 10px, that way you can use rem units to set specific font sizes on different elements. I.E., by setting font size to 62.5%, if I wanted a <p> tag to be 16px, I would set it like this:

html { font-size: 62.5%; }

.my-p-tag{ font-size: 1.6rem; }

This also helps because you can use rem units for padding, margins or any other measurement you need

Hope it's helpful for you!