Product Review Card design implemented with CSS Flexbox and patience

Hi Stephen! Good job on getting really close to the design!

Regarding your issue with the image URL, when we write a URL in the css file, that URL is relative to where the css file is located. So when you say "images/image-name.jpg" what it's actually looking in is "css/images/image-name.jpg". To target the actual images folder, you first need to go up to the parent folder, which you can do by using a double period. So it would look like "../images/image-name.jpg".

As for the positioning of the image, I found it easier to simply use a div with a background image applied to it, which allowed me to use the background position and size properties:

.preview-img {
	background-image: url(./images/image-product-desktop.jpg);
	height: 100%;
	background-position: center;
	background-size: cover;
}

For accessibility purposes, I added an aria-label to the div:

<div
	class="preview-img"
	role="img"
	aria-label="Bottle of Gabrielle Essence Eau De Parfum"
></div>

Check out my solution if you want to have a deeper look.You should also work though the HTML Validation Report to fix any errors with your markup.

Hope this helps :)