martins Posted May 20, 2010 Share Posted May 20, 2010 Hi. I've been looking for some nice css examples/skeletons of a 3 column website. I've found a few but they all mention some Opera/IE bugs. I don't now how dated the examples are so I'm not sure how relevant they are. Can anyone recommend (link/example, etc) a recommended skeleton for a 3-column website (with a 'header'). Thank you Link to comment https://forums.phpfreaks.com/topic/202439-css-skeleton/ Share on other sites More sharing options...
xcoderx Posted May 21, 2010 Share Posted May 21, 2010 3 column <!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" xml:lang="en-gb" lang="en-gb"> <head> <title>3 Column Layout Example</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css" media="screen"> #wrapper { width:960px; margin:0 auto; padding:0.1em; background-color:red; } #header { padding:1em; background-color:blue; } #container { padding:1em; background-color:green; } #lefCol1 { float:left; width:165px; padding:1em; background-color:orange; } #midCol2 { float:left; width:500px; padding:1em; background-color:yellow; } #rigCol3 { float:left; width:165px; padding:1em; background-color:purple; } #footer { text-align:center; color:white; clear:both; padding:1em; background-color:black; } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix { display: inline-block; } * html .clearfix { height: 1%; } .clearfix { display: block; } </style> </head> <body> <div id="wrapper"> <div id="header">XCODERX</div> <div id="container" class="clearfix"> <div id="lefCol1">Column 1</div> <div id="midCol2">Column 2</div> <div id="rigCol3">Column 3</div> </div> <div id="footer">Footer</div> </div> </body> </html> Link to comment https://forums.phpfreaks.com/topic/202439-css-skeleton/#findComment-1061468 Share on other sites More sharing options...
xcoderx Posted May 21, 2010 Share Posted May 21, 2010 this is one small and cute template i like http://www.minimalistic-design.net/dark.zip modify it according to ur needs if you like it then ;-) Link to comment https://forums.phpfreaks.com/topic/202439-css-skeleton/#findComment-1061469 Share on other sites More sharing options...
martins Posted May 21, 2010 Author Share Posted May 21, 2010 thanks xcoderx. I'll play with them Link to comment https://forums.phpfreaks.com/topic/202439-css-skeleton/#findComment-1061511 Share on other sites More sharing options...
haku Posted May 21, 2010 Share Posted May 21, 2010 I've found this site has good layouts that are cross-browser compatible. I often use it as my starting skeleton: http://www.dynamicdrive.com/style/layouts/ Link to comment https://forums.phpfreaks.com/topic/202439-css-skeleton/#findComment-1061534 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.