Skip to content
Submitted over 1 year ago

Order summary component | Vanilla HTML & CSS

Muhammad Noman•230
@BitWizCoder
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

After trying out some of the other Challenges and receiving some helpful advice from you all, I decided to use only relative units and made an effort to use HTML that makes more sense in terms of content and structure.

Community feedback

  • hitmorecode•6,680
    @hitmorecodePosted over 1 year ago

    Congratulations well done. The background is not like the desing, this is what you can do to fix this.

    body {
background: url(./images/pattern-background-desktop.svg);
background-color: hsl(225, 100%, 98%);
background-repeat: none; ## change none to no-repeat.
/*     background-position: center; */ ## remove this line
background-size: cover; ## change cover to contain
font-family: 'Red Hat Display', sans-serif;
}

    This should fix that issue

    Marked as helpful
    1
    Muhammad Noman•230
    @BitWizCoderPosted over 1 year ago

    @hitmorecode Thank you very much, brother. it was very nice of you to help. I tried my best but couldn't fix the BG image. again thank you :)

    0
    hitmorecode•6,680
    @hitmorecodePosted over 1 year ago

    @mhmdNoman anytime bro, I'm glad I could help 👍

    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