Design comparison
Solution retrospective
An easy task for beginners, I advise everyone
Community feedback
- @Islandstone89Posted 11 months ago
HTML:
-
Every webpage needs a
<main>
that wraps all of the content, except for<header>
andfooter>
. This is vital for accessibility, as it helps screen readers identify the "main" section of a page. Change.main
into a<main>
. -
"Proceed to payment" would probably navigate you to the next page - to me it makes more sense as a link.
CSS:
-
It's good practice to include a CSS Reset at the top.
-
font-size
must never be in px. This is bad for accessibility, as it prevents the font size from scaling with the user's default setting in the browser. Use rem instead. -
Set
font-family
on thebody
and remove it elsewhere - this is more efficient than setting it on each part. -
Do not use fixed widths and heights, except for on the music icon. You rarely want to set fixed dimensions, especially heights.
0 -
Please log in to post a comment
Log in with GitHubJoin 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