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

@CodeWithDion

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

Luka Glonti 3,440

@lack21

Posted

Good job 👍, but I have some recommendations!

  • Remove width: 100vw from the body, body is a block level element which by default takes full width available, so width: 100vw does nothing here!
  • Replace height: 100vh to min-height: 100vh in the body, the difference is that, when you set height: 100vh to something, that means it won't be bigger than that, it might cause some problems in the future, so better approach is to set min-height: 100vh, like this in case content is overflowing container will adjust to it, after that you can as well remove height: auto from the body!

Marked as helpful

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