Design comparison
Solution retrospective
i'm proud to say i was able to enjoy myself while doing this!!
What challenges did you encounter, and how did you overcome them?centering the div, i looked at older projects and figured out how to implement that solution on this one
What specific areas of your project would you like help with?i'm just confused as to why the page has a scroll even though the container is not occupying the whole height
Community feedback
- @kodan96Posted 6 months ago
hi there! 👋👋
You didn't do a CSS reset at the top of your CSS file, so your
body
has 8pxmargin
on it, since you set amin-height: 100vh;
onbody
it takes up the whole screen, but there's it's margin above and below it, and the margin causing the overflow and the scrolling. This is the default behavior of the browser, it's good practice to do a CSS reset when you start your project. This means you're overwriting these default values. I usually do a CSS reset like this:* { margin: 0; padding: 0; box-sizing: border-box; }
*
is theuniversal selector
in CSS, my code sets every elementspadding
andmargin
to 0. Note that if you apply these now, you need to rearrange your entire layout.Hope this helps 🙏
Good luck and happy coding! 💪
Marked as helpful1
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