Order-summary-component-challenge

Community feedback

• 

  Travolgi 🍕•31,340

  @denielden

  Posted about 3 years ago

  Hi Rakesh, goodjob! Congratulations on completing the challenge.

  You can positing with flex box:

  • but first add main tag and wrap the card for Accessibility
  • try to remove all margin from first-img and middle-box classes
  • use flexbox to the body for center the card. Read here -> flex guide
  • also set heigth of body to 100vh because Flexbox aligns to the size of the parent container.
  • try to add a little transition on the element with hover effect

  In the end for add the top image in the background just put more specific background properties to the body:

  background: url("../img/pattern-background-desktop.svg") no-repeat top center;
  background-size: contain;
  background-color: #e0e8ff;
  

  Hope this help ;) and happy coding!

  11

  Marked as helpful
• 

  Naveen Gumaste•10,420

  @NaveenGumaste

  Posted about 3 years ago

  Hay ! Rakesh Good Job on challenge

  These below mentioned tricks will help you remove any Accessibility Issues

  -> Add Main tag after body <main class="container"></main>

  -> Learn more on accessibility issues

  If this comment helps you then pls mark it as helpful!

  Have a good day and keep coding 👍!

  00

  Marked as helpful
• 

  Efraim Munthe•230

  @Klrfl

  Posted about 3 years ago

  What problem do you have? Can you specify?

  01