Order summary Component

Community feedback

• 

  Bill McDavitt•460

  @BMcdavittPosted about 2 years ago

  Hi GRAVIT,

  Another suggestion to help you center the card would be to set the body height to 100vh. This will allow you to set the display to flex and align-items to center:

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

  Now you can remove the margins from .card and everything will center perfectly in all displays.

  Happy coding!

  Marked as helpful

  1
• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello GRAVIT, Congratulations on completing this challenge!

  Your solution its almost done and I’ve some tips to help you to improve it:

  Your background is applied but its not too similar to the design yet. Add background-size: contain instead of background-size: cover to make it display the size full width and center with the card vertically. Note that now is slightly different from the challenge design.

  body {
      background-image: url(./pattern-background-desktop.svg);
      background-repeat: no-repeat;
      background-size: contain;
      background-color: var(--pale-blue);
  }
  

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  0