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

@kajalatish

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Do you have any questions about best practices?

Community feedback

Mason Dunn 100

@mason-dunn

Posted

Hi,

Your Github link appears to be broken. I'd be more than happy to take a look at your code once it gets fixed.

0

Mason Dunn 100

@mason-dunn

Posted

@mason-dunn Here is some feedback after looking through your code from the developer tools:

  1. Use semantic html tags. I noticed that you use <p> for all text. Instead of using <p> for your title and main-title it would be more appropriate to use h1-h6 tags.

  2. Look into flexbox and css grid to learn how to position your card and its corresponding children where you want them easier. I noticed you have a margin-left on your card that pushes it where you want.

  3. Research some responsive design practices to come back and improve upon this in the future. You have a solid foundation here and after doing some research you can get this function on mobile devices too.

Good work.

0

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