Clever Geek Handbook

Body height is 100% greater than screen height

I have set the tag tag html body

as 100%

, but in Firefox, which shows as a few pixels than the screen, the navigation bar appears. How can I customize this other than specifying an arbitrary one height :98%

? I set padding

and margin

to zero.

I only use bootstrap for css if that matters.

+4


source to share


2 answers


Check the items inside body

. One of them probably has margins or even content extends outside of the element body

. Just try to remove all internal items one by one in Firefox dev.tools and notice that removing the item will fix the problem.



+6


source


Just to follow up on the answer above, I noticed that padding can have the same effect, but can only be seen when checking elements.



<button class="sbtn">
    <span class="text">
        my btn
    </span>
</button>

.sbtn {
    height: 5vh;
    background-color: red;
}

.text {
    padding: 10vh;
    color: white;
}
+1


source






More articles:


All Articles