CSS – Simulate a table with CSS and DIV

CSS – Simulate a table with CSS and DIV

Required CSS:

<style type="text/css">
div#table
{
width:210px;
border-top:1px solid black;
}

div.table_tablerow
{
clear:both;
overflow:hidden;
border:1px solid black;
border-top:none;
}

div#table div div.column1
{
width: 100px;
float:left;
}

div#table div div.column2, div.column3
{
width: 50px;
float:left;
text-align: center;
}
</style>

Required HTML:

<div id="table">
<div class="table_tablerow">
<div class="column1">H1</div>
<div class="column2">H2</div>
<div class="column3">H3</div>
</div>
<div class="table_tablerow">
<div class="column1">1</div>
<div class="column2">2</div>
<div class="column3">3</div>
</div>
</div>