Order Summary Page

Community feedback

• 

  Lorenzo•130

  @LorenzoTesoroPosted almost 2 years ago

  Hi Eric!

  You did a great job with this challenge, but there're two problems with your desktop design:

  1- There aren't semantic tags: you used a simple div, but it's not semantic and this can be a problem with regard to compatibility. Overall, use semantic tags as header, main, footer and so on. In this case, you can use a main tag to put inside it all your page content and a footer for the links. This a link to documentation: https://www.w3schools.com/html/html5_semantic_elements.asp;

  2- You pass from h1 to h4: all headings in a page have to be ordered hierarchically, from h1 to h6. In this case, you can use an h1 for the page title(remember that a page can contain only an h1) and an h2 for the plan name. (https://dequeuniversity.com/rules/axe/4.3/heading-order?application=axeAPI)

  I hope that it can be useful :)

  0
• 

  Hassia Issah•50,650

  @HassiaiPosted almost 2 years ago

  Replace<div class="container">with the main tag,<h4> with <h2> and <div class="attribution"> with the footer tag to fix the accessibility issues. click here for more on web-accessibility and semantic html

  Give the body a background-size of pale-blue and a background-size of contain.

  There is no need to give .container a margin value. increase the border-radius of .container

  Give .paymentBtn a box-shadow color of hsla(245, 75%, 52%, 0.5). You forgot to add hover effect to your design.

  In the media query you only have to change the background-image of the body.

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  0