P
Shaun Pour• 630
@ShaunPour
Posted
Thanks! I was wondering why all these smaller components insist on filling most of the screen.
0
Design comparison
Solution retrospective
What are you most proud of, and what would you do differently next time?
I struggled with making the design an exact match and parts of it I left as somewhat unfinished compared to the design. I would probably spend a little more time on redoing the design more precisely for each screen size if I did it again.
What challenges did you encounter, and how did you overcome them?
There wasn't really anything I'd call a challenge but some sections I did have more trouble getting to match up as precisely as I'd like.
What specific areas of your project would you like help with?
N/A
Community feedback
Account Deleted
Give the container a max-width so it doesn't fill the whole screen. And to center the card use flexbox:
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
To remove the default margin of everything use the following at the beginning of the CSS:
*, *::before, *::after {
padding: 0;
margin: 0;
}
That will get rid of unwanted default margins and paddings which will make everything more convenient. * means "all elements".
0
Please log in to post a comment
Log in with GitHub
Join 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