Skip to content
Submitted over 1 year ago

Order summary card

levy_m•60
@LevyMatias
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

  • I used the B.E.M methodology in my solution to have better management of my html and css classes.
  • I believe it is not 100% identical. I couldn't expand the background image to cover the width of the screen, so I didn't put it in.
  • Any hints or suggestions I will be grateful.

Community feedback

  • Luka Glonti•3,440
    @lack21Posted over 1 year ago

    Great work 👍, but I have some recommendations!

    • 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!
    • Remove width: 100% from the body, body is a block level element which by default takes full space available, so width: 100% does nothing here!
    Marked as helpful
    1
    levy_m•60
    @LevyMatiasPosted over 1 year ago

    @lack21 Wow, thanks for the recommendations, I really appreciate them. 👍

    1

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