Design comparison
Solution retrospective
Hi, this is my take on this challenge. Feedback is welcome. While the navbar is working, I'm not fully satisfied with it. It doesn't seem to be obeying grid rules in some cases, like there's quite a bit of padding when on fullscreen mode.
Community feedback
- @Tryt4nPosted over 1 year ago
It's because you gave
min-height: 100vh;
for your body. Change it for display of flex, flex direction of column and justify-content of center. Then deletemargin-top
from your footer and it would be done.Nice trick for debugging CSS:
* { background: hsla(100, 50%,50%, .2); }
You can use something like this. It gives opaque background to everything on your page. So the backgrounds of the elements will overlap each other. Thanks to that you will be able to see where the problem is placed. Before you edit your solution just check it out. Also if you have some pseudo elements
::before
or::after
also give them the background.*::before
and*::after
0
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