Skip to content
Submitted almost 2 years ago

Order summary

Klaidas Kavaliauskas•50
@donichkis1
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Order summary component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

When I make the height slightly smaller, the inside of the container gets really congested. What's the best practice to avoid that?

Community feedback

  • Amal Karim ✅•1,290
    @amalkarimPosted almost 2 years ago

    Hi Klaidas 👋

    I don't know if this is best practice or not, but I will not specify the height of a component if it's not required. Because not all browsers height are the same. For example, you could try to visit the preview site using smartphone in landscape mode. Some text inside the card will move outside because the card's height is less than its content. To avoid that, remove all height property in container. Also, change height: 100vh; in body to min-height: 100vh;.

    Hope this helps. Happy coding!

    2

Please log in to post a comment

Log in with GitHub

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