@Bayoumi-dev
Posted
Hey Khadija, It looks good!...
My suggestions:
Document should have one main landmark
, Contain the component with<main>
.
<main>
<div class="container">
//...
</div >
</main>
Page should contain a level-one heading
, Changeh2
toh1
<h1>Join our community</h1>
You should always have one h1
per page of the document... in this challenge, you will use h1
just to avoid the accessibility issue
that appears in the challenge report... but don't use h1
on small components <h1>
should represent the main heading for the whole page, and for the best practice use only one <h1>
per page.
- Also, I suggest you center the component on the page, by giving the parent element
<main>
the following properties:
main {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
}
.container {
width: 350px;
/* margin: 0 auto; */ <--- Remove
//...
}
I hope this is helpful to you... and I want a cookie 🍪
@khadijahashmi2
Posted
@Bayoumi-dev Hii! thankyou so much, i just posted my edited solution, it was really helpful! here's a cookie 🍪 and some milk to go with it 🥛 :D