@Tryt4n
Posted
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 delete margin-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