CSS Tables – The Limitations

Oh, CSS, you’ll never give up do you. So, think again, float is not dead. How’s that? First off, take a CSS table for layout. Secondly, realize that, in a table, there is no way to seperate table blocks, except if you put something in-between.

What used to be this with floats:

<div class="table_table">
<div class="table_row">
<div class="table_cell"></div>
<div class="table_cell"></div>
<div class="table_cell"></div>
</div>
</div>

Is now this ugly thing with CSS tables:

<div class="table_table">
<div class="table_row">
<div class="table_cell"></div>
<div class="table_cell_spacer"></div>
<div class="table_cell"></div>
<div class="table_cell_spacer"></div>
<div class="table_cell"></div>
</div>
</div>

(Sorry for the lack of code indentation, WordPress is acting stupid)

Anyways… spacers! Oh god, no. Luckily, borders can aproximate spacing and most image-based design cuts won’t need those margins in-between blocks. Actually, the fortunate news is that about 90% of the time, the spaces between blocks is what you don’t want.

I don’t think CSS tables are going to make CSS logic that much easier. If you were using floats in a good way, chances are you won’t have to change much in your HTML structure. I didn’t say you won’t have to change anything! Yes, CSS tables eliminate the need for container blocks or float clears everywhere and yes, CSS tables will fix a lot of bugs and make possible a lot of cool things; like menues that expand with content and 100% height properties that base themselves on the browser window, not parent CSS block, oh god yes.

Leave a Reply

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

*

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>