CSS: Tableless table

Table layout can be achieved without <table> in html, but with <div> and CSS.

Define CSS:

 .col { width: 200px; float: left; } 

Tableless table:

<div>
    <div class="col">row 1, col 1</div>
    <div class="col">row 1, col 2</div>
</div>
<div style="clear: both;"> 
    <div class="col">row 2, col 1</div>
    <div class="col">row 2, col 2</div>
</div>

Using <span>?

Do not use <span> to define table cell.

According to specification, width property does not apply to in-line elements, which includes <span>.

Leave a Reply

Your email address will not be published. Required fields are marked *