954,604 Members — Technology Publication meets Social Media

Two column CSS layout

0

By Dani Horowitz on Apr 14th, 2007 5:14 am

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.

<div style="width:900px">

<div id="leftColumn" style="float:left; width:200px;">
          Left sidebar with a width of 200 pixels
</div>

<div id="rightColumn" style="float:right; width:650px;">
          Body content
</div>

<div style="clear:both"></div> <!-- Catches the shorter column up -->

</div>

0

Nice and neat job there!

Newbie Poster

2 posts since Dec 2007

Reputation Points: 10

Solved Threads: 1

0

Hi, do you know how to change blogger.com blog layout with the ones like friendster or myspace? Thank you.

Newbie Poster

7 posts since Oct 2007

Reputation Points: 10

Solved Threads: 0

0

Cool !

Light Poster

28 posts since Mar 2008

Reputation Points: 10

Solved Threads: 2

0

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

10 posts since Apr 2008

Reputation Points: 10

Solved Threads: 1

0

You can easily create two column table less by using tag with "float" attribute (mentioning float value "left")

Newbie Poster

6 posts since Jul 2009

Reputation Points: 3

Solved Threads: 0

0

Wow, this is very helpful. Should I delete the numbers? Thanks

Junior Poster in Training

50 posts since Nov 2007

Reputation Points: 10

Solved Threads: 0

This article has been dead for over three months

You

© 2012 DaniWeb® LLC

Home | About Us | Contact Us | Terms of Service | Advertising Opportunities