944,084 Members | Top Members by Rank

Web Development > Web Design > HTML and CSS > Two column CSS layout
Ad:
0

Two column CSS layout

by on Apr 13th, 2007
I am often asked how to create a tableless two column CSS layout so I thought I would just post it here for once and for all.
HTML and CSS Code Snippet (Toggle Plain Text) 
  1. <div style="width:900px">
  2.  
  3. <div id="leftColumn" style="float:left; width:200px;">
  4.           Left sidebar with a width of 200 pixels
  5. </div>
  6.  
  7. <div id="rightColumn" style="float:right; width:650px;">
  8.           Body content
  9. </div>
  10.  
  11. <div style="clear:both"></div> <!-- Catches the shorter column up -->
  12.  
  13. </div>
Comments on this Code Snippet
Permalink
Dec 2nd, 2007
0

Re: Two column CSS layout

Nice and neat job there!
Newbie Poster
gach94 is offline Offline
2 posts
since Dec 2007
Permalink
Apr 3rd, 2008
0

Re: Two column CSS layout

Hi, do you know how to change blogger.com blog layout with the ones like friendster or myspace? Thank you.
Newbie Poster
ODCHOI is offline Offline
7 posts
since Oct 2007
Permalink
Apr 11th, 2008
0

Re: Two column CSS layout

Cool !
Light Poster
holmes008 is offline Offline
28 posts
since Mar 2008
Permalink
Dec 21st, 2008
0

Re: Two column CSS layout

Hi'' i divided my page into tow parts(left and right) with div tag,so i want to load right part content into right part without loading all the page.
Newbie Poster
monem is offline Offline
10 posts
since Apr 2008
Permalink
Jul 1st, 2009
0

Re: Two column CSS layout

You can easily create two column table less by using <div> tag with "float" attribute (mentioning float value "left")
Newbie Poster
sunil8986 is offline Offline
6 posts
since Jul 2009
Permalink
Feb 9th, 2011
0

Re: Two column CSS layout

Wow, this is very helpful. Should I delete the numbers? Thanks
Junior Poster in Training
silveraden is offline Offline
50 posts
since Nov 2007
Message:
Previous Thread in HTML and CSS Forum Timeline: font name??
Next Thread in HTML and CSS Forum Timeline: CSS trouble





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC