Design comparison
Community feedback
- @Nadine-GreenPosted almost 2 years ago
HEY THERE!
CONGRATULATIONS ON COMPLETING YOR FIRST CHALLANGE :)
I noticed that you have a few accessibility issues, I can help you with some of them:
-
Instead of using a
div
for<div class="card">
, you could instead use a more semantic element likemain
. -
You should use a
h1
instead of ah2
for this code:
<h2>Gabrielle Essence Eau De Parfum </h2>
After doing so, you will need to generate a new report, the button to do s should be just above the report itself.
HOPE I COULD BE OF HELP :)
HAPPY CODING!
Marked as helpful1@Alord81Posted almost 2 years ago@Nadine-Green Hello ! Thanks for your fine advice,I will try to avoid and correct the points you mentioned in the coming times. Thanks Again ;)
0 -
- @HassiaiPosted almost 2 years ago
Replace <div class="card"> with the main tag and <h2></h2> with <h1></h1> to fix the accessibility issues. for more on semantic html visit https://web.dev/learn/html/semantic-html/
To center .card on the page, add min-height:100vh; display: flex; align-items: center: justify-content: center; to the body, instead giving the body margin: 50px auto;.
reduce the width value of .card to 600px and changer the height value to auto; Give .text background-color of white instead of giving .card background-color of white.
Use rem or em as unit for the padding , margin, width and preferably rem for the font-size for more on this watch this https://youtu.be/N5wpD9Ov_To
Hope am helpful. HAPPY CODING
Marked as helpful0@Alord81Posted almost 2 years ago@Hassiai Thank you as big as the sky. You don't know how much help you gave me at the beginning of my path. <thank you so much>
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