CSS DIV Code Instead of Tables

It’s always better to use CSS div code instead of tables for layout items in HTML. Use tables only if you have tabular data and lots of it. But if for example you just want to display a 1 row, two column item on your pages use div’s.

Here’s a n example.

Here’s the HTML Code for the above example:

<div id=”col1″>This is the first column.  I can put anything in here.</div>
<div id=”col2″>This is the second column and again I can insert anything in place of this text.</div>
<div id=”content-below”>

This is the rest of the content below the columns.

</div>

Here is the CSS code for the above;

#col1 {
width: 48%;
float: left;
font-weight: bold;
padding: 10px 0 10px 0;
}
#col2 {
width: 48%;
float: right;
font-weight: bold;
clear: right;
padding: 10px 0 10px 0;
}
#content-below {
clear: both
}