I am very new to CSS and just wondered how I get the 3 column look, here is what I done so far but I don't think it is correct. Here is the HTML I thought I had to do <div class="col1"></div> <div class="col2"></div> <div class="col3"></div> Code (markup): And here is what I got in my CSS for it .col1 { line-width: 20%; } .col2 { line-width: 60%; } .col3 { line-width: 20%; } Code (markup): If this is not right then what is the correct way of getting this look?
there are many ways to do this, depedning on your exact requirements. unfortunately none as simple as the code you have. try here: http://bluerobot.com/web/layouts/index.html dissect them and learn from them btw: its just width not line-width
It would need to be more like this <div class="wrap"> <div class="col1"></div> <div class="col2"></div> <div class="col3"></div> <div> Code (markup): CSS .wrap {width:900px;} .col1 { line-width: 18%; float:left; margin:2px; } .col2 { line-width: 59%; float:left; margin:2px; } .col3 { line-width: 19%; float:left; margin:2px; } Code (markup):
Just wrote this up... Hope it helps http://www.gspwebhosting.com/blog/2007/07/26/fluid-three-column-css-layout/
Actually, if you take a look at my "All You Need to Know About SEO" thread (link is in my signature) I have a three column layout that's been released into the public domain that you can use. If you need help understanding any of it, feel free to ask me and I'll do my best to help.