Add something new to Virb:

Virb

Are you sure you want to delete that?

or Cancel

 

Posted on Apr 6, 2007

CSS Tips Basic: Two columns

This is one of the key things involved in avoiding TABLE layouts and using DIV layouts.

Example 1


Column 1


Isn't it so beautiful?



Column 2


Isn't it beautifuler?







You can just as quickly add a third column as long as the total width of the three columns doesn't exceed their container's width.

Example 2


Column 1


Isn't it beautiful?


Column 2


Isn't it beautifuler?


Column 3


Lovely






The Code


<div style="float: left; width: 200px; margin: 0 auto;">Content here</div>
>div style="float: left; width: 200px; margin: 0 auto;">Content here</div>




The above code will create two colums that are side by side.

Loading comments...

7 Likes

Tags

Details

Viewed 8,383 times

© 2007 chrysb

virb.com/t/7389
tweet!

Flag this text post!

Flag this text post as:

or Cancel

 

Advertisement

Flag this profile!

Flag this profile as:

or Cancel