@meistens
Posted
Hey there, Not bad with the design, though to be honest, your code was kinda hard to read. Here's some tips though
body {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
min-height: 100vh;
background-color: hsl(217, 54%, 11%);
}
Once you got the body sorted out, apply these to your container and fiddle about with the height and width values as you fit.
.container{
background: hsl(216, 50%, 16%);
width: 15rem;
height: auto;
border-radius:1rem ;
}
For centering the eye icon and the background color, use the ::before
and ::after
pseudo elements, should make things easier for you
@Pawel-Gnat
Posted
@meistens Wow, your comment really means a lot for me. Thanks, you are so helpful! I was looking for this kind of answers :)
@meistens
Posted
@Pawel-Gnat glad I could help