/ Published in: HTML
This code is both basic and available from 24ways.org, but it's damn handy to reach through the snipplr plugin from textMate.
PS: all cred to Rachel Andrew & the 24ways team.
PS: all cred to Rachel Andrew & the 24ways team.
Expand |
Embed | Plain Text
Copy this code and paste it in your HTML
// ========== // = HTML = // ========== <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="stylesheet" type="text/css" href="fixed-width-centred.css" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body> <div id="wrapper"> <div id="side"> <div class="inner"> </div> </div> <div id="content"> <div class="inner"> </div> </div> <div id="footer"> <div class="inner"> </div> </div> </div> </body> </html> // ========== // = CSS = // ========== body { text-align: center; min-width: 740px; padding: 0; margin: 0; } #wrapper { text-align: left; width: 740px; margin-left: auto; margin-right: auto; padding: 0; } #content { margin: 0 200px 0 0; } #content .inner { padding-top: 1px; margin: 0 10px 10px 10px; } #side { float: right; width: 180px; margin: 0; } #side .inner { padding-top: 1px; margin: 0 10px 10px 10px; } #footer { margin-top: 10px; clear: both; } #footer .inner { margin: 10px; }
URL: http://24ways.org/2005/css-layout-starting-points