Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Order Summary

@AuroraBorealis97

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any feedback is appreciated!!

Community feedback

dewslyse 3,025

@dewslyse

Posted

Hello Alicia 👋! Congrats on completing your first challenge on frontend mentor. Your solution is well implemented. Well done 👏👏👏. Some things to note:

  • You could wrap your img on line 20 of the html in a header or figure tag to have it selected by a landmark. For improved accessibility, add and empty alt (alt=" ") to the img tag and set aria-hidden: true.

Alternatively, your could attach the image to the page in body of your css. Eg.:

body {
   background: $pale-blue url("./images/pattern-background-desktop.svg") no-repeat;
   background-size: contain;
}
  • h and p elements cannot be child elements of a span. You could replace the <span> with a <div>

Happy coding and best of luck with subsequent challenges

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

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