Order-summary-component-challenge

Community feedback

• 

  Travolgi 🍕•31,400

  @denieldenPosted almost 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!

  Marked as helpful

  1

  ---

  

  Rakesh Kumar•20

  @Rakesh709Posted almost 3 years ago

  @denielden Thank you for the wonderful explanation.

  1
• 

  Naveen Gumaste•10,480

  @NaveenGumastePosted almost 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 👍!

  Marked as helpful

  0
• 

  P

  Efraim Munthe•230

  @KlrflPosted almost 3 years ago

  What problem do you have? Can you specify?

  0

  ---

  

  Rakesh Kumar•20

  @Rakesh709Posted almost 3 years ago

  @Klrfl How to set background color as mention.

  0