Full height div not stretching

Question

Hi there I have been working on a website for quite some time now, improving code etc. I have just noticed that, on smaller screens, the height of the white background does not stretch past all of the content.

Setting min-height: 100%; and height: 100%; do not seem to solve it, do you think this could be down to the fact that a lot of the content is floating?

Any suggestions would be much appreciated.

Answer 1

在你的div.container ，删除height: 100%并添加overflow: auto 。

Answer 2

You can use inline-block to main div , like:-

div.container{
   display:inline-block;
}

Answer 3

Remove "height: 100%" from the container, "float: left" from the footer and add "clear:both" to the footer. This will clear all the floats in the container and the background color of the container will be visible all the way down the page, regardless of the browser size.

Answer 4

Try putting overflow:hidden; on the container that you want to clear under the rest of the content