Shoaib Shuja• 560
@ShoaibShuja
Posted
Amazing job my friend but the component is not perfectly centered and here are some tips to make the code look better.
First of all, for the page styling create a CSS external file and link it to the page.
Second make the body take the whole page and center the elements inside the body by copying these lines of code to your file:
body {
width: 100%;
min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
Remove the margin-top from .container and change the container width to take less space to match the challenge's main design I would recommend 30% or as you desire.
Learn a bit more about CSS flexbox and grids.
Marked as helpful
0
