Skip to content
Submitted about 3 years ago

HTML and CSS only

lmef•15
@LuisMiguelEstradaFernandez
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 am new to html css, if you could give me some advice it would be great. Thanks.

Community feedback

  • darryncodes•6,390
    @darryncodesPosted about 3 years ago

    Hi Lmef,

    Good effort, very close to the design!

    You could try flex to center your design nicely in the viewport and the following to match the background to the design (add to your <body> styles) :

    min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;

background-size: 100% auto;
background-repeat: no-repeat;
background-color: hsl(225, 100%, 94%);
    Marked as helpful
    1
    lmef•15
    @LuisMiguelEstradaFernandezPosted about 3 years ago

    @darryncodes Thank you! I'll try :D

    0
  • Sami Maachi•230
    @Sami-21Posted about 3 years ago

    great try my friend. try to fix the background by using background-repeat:no-repeat; in CSS. just keep on learing you are on the right path. good luck

    Marked as helpful
    1
    lmef•15
    @LuisMiguelEstradaFernandezPosted about 3 years ago

    @Sami-21 Thank you! I will continue learning.

    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