The Single-Cell Table

Below this text sits the lonely single cell table. Tables, though "incorrectly" used for many, many years, offer a powerful yet "simple" option for layout. Remember that Tables are block level elements so they will force a line break

I'm using this single cell xhtml Table (with a little css for style) to illustrate some of the simple things you can do. Be aware that html tables and xhtml tables can/will do "different" things :-) ...

By default tables will "wrap" tight around the text that's in the cell/cells, unless you tell it otherwise. Additionally the size of the cell, even if you declare it, may change based on the contents of the cell. This is good and bad, it all depends on whether you use this for your design or it uses you and hurts your design.

hi, I'm a Table

Some examples of how this single cell table can be used more effectively (Note, I'll be using css on the Table quite a bit):

The "bad" page

The "bad" page made better (fixed width/centered)

The "bad" page made better (flexible width/centered)

The "bad" page made better (fixed w/padding/border)

The "bad" page made better (fixed w/padding/background-color/"reverse" font color)

ps - Don't forget to look at the above pages in Print Preview as well

pps - Yes, a Div can do this just as well...actually better, but hey some people like Tables