StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>I once found an amazing template that amazingly works on all browsers, even IE6, I cant remember the link, but here is the CSS and the HTML for it:</p> <p>CSS:</p> <pre><code>body, html{ height: 100%; } body, p { margin: 0; padding: 0; } #wrapper { min-height: 100%; } * html #wrapper { height: 100%; } /*HEADER------------------------------------*/ #header { width: 100%; background: #666; } #header_900 { width: 960px; height: 100px; margin: 0 auto; position: relative; overflow: hidden; } /*FOOTER------------------------------------*/ #footer { width: 100%; height: 100px; margin: -100px auto 0 auto; /*THIS SHOULD BE EQUAL TO THE FOOTERS HEIGHT*/ position: relative; background: #666; } #footer_900 { width: 960px; height: 100px;/*THIS IS THE FOOTERS HEIGHT*/ position: relative; margin: 0 auto; } /*CONTENT------------------------------------*/ #content { width: 100%; padding-bottom: 100px; /*THIS SHOULD BE EQUAL TO THE FOOTERS HEIGHT*/ } #content_900 { width: 960px; margin: 0 auto; overflow: hidden; } </code></pre> <p>And here is the HTML:</p> <pre><code><body> <div id="wrapper"> <div id="header"> <div id="header_900"> <p>header</p> </div> </div> <div id="content"> <div id="content_900"> <p>content</p> </div> </div> </div> <div id="footer"> <div id="footer_900"> <p>footer</p> </div> </div> </body> </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload