Full height div not stretching

Hi th开发者_开发知识库ere 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.

On your div.container, remove height: 100% and add overflow: auto.

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.

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

div.container{
   display:inline-block;
}

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