Question

live (work in progress) site

Basically, I have all of my site’s content centered within a div that is a specified width and an intended height of 100% regardless of the actual length of the content. I’ve specified height:100%; for html, body, and #main however the div still comes up short as seen on this page– I don’t want their to be any gap between the #main‘s grey box and the bottom of the screen. Is this possible? How?

Answer 1

see this jsfiddle

html, body {height: 100%;}
.container {min-height: 100%;}

discussing this over here too…..

proper css to ensure that the body element fills the entire screen