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

Order-Summary-Component

Ghaffar_bโ€ข 240

@Ghaffar7

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Lucas ๐Ÿ‘พโ€ข 104,420

@correlucas

Posted

๐Ÿ‘พHello Ghaffar, congratulations for your solution!

Your background-image isn't display its full size. You can see that the background is cropped in the right size, to fix that you need to use some background properties and align it top. To allow the background to fill all the screen use background-size: cover;.

See the body with the background changes below:

body {
    background: url(./images/pattern-background-desktop.svg);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
}

I hope it helps you and happy coding!

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