Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Product preview card component

@ana-cassia-invernizzi

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

lirone 320

@LironeFitoussi

Posted

Hey Ana, Great Job You've done There! Your code looks good overall. Here are a few areas for improvement:

Ensure that the image paths in the background-image properties are correct and that the images are in the specified locations.

Consider adding more comments in your HTML code to describe the purpose of each element, especially if the page becomes more complex in the future.

While the code is well-organized, keeping your CSS rules organized specificity and purpose is a good practice based on there to improve maintainability as the codebase grows.

You might want to include a font-weight property for your h2 elements within the .card_info container, as it currently inherits the font-weight from the global h2 styling. For example, you can add font-weight: 700; to .card_info h2.

Verify the paths for your favicon (href="./images/favicon-32x32.png") and ensure that the favicon file is present in the specified location.

add letter-spacing on perfume

Keep up the good work, and best of luck with your coding endeavors!

Marked as helpful

2

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord