Topic: deciding between divs within divs/ tables within divs

I know I keep reading that tables are for tabular data, but what is considered tabular data.

I have 4 divs so far. in my TEST site to learn this stuff, wrapper/header/nav/content. Now I want to create more divs OR tables inside the content div.

So if my content area will include images etc wrapped with text should I use a table with say 3 columns or another div.

The same question goes for say a directions and hours text area in the header. Do I use a table or another div. inside the header.

If I was to have one image say in the header and no text would I use another div or just use the header div to hold the image. Same question if it was just a paragraph of text inside the header.

Are there rules somewhere that help me determine what to do when?

Thanks
Ant

Vote up Vote down

Re: deciding between divs within divs/ tables within divs

Tabular Data is kind of what you'd put in a spreadsheet.

For simple things like hours, you can just use <p>s and <span>s/.  Example:

<p>Monday <span class="hours">8 to 5</span></p>
<p>Tuesday <span class="hours">8 to 5</span></p>

And in your cSS:  .hours {float: right;}

And there's no need to put a div inside a div just to hold an image -unless there's something special going on.

Just because my computer is online does not mean that I am.
a&b WebDesign

Vote up Vote down

Re: deciding between divs within divs/ tables within divs

I know I keep reading that tables are for tabular data, but what is considered tabular data.

I'd say that in general, avoid using tables -- in most cases, using a div or a unordered list (for navigation, for example) makes the most sense. When I think of "tabular data" I think of something similar to most of these images:

http://images.google.com/images?q=data+table

Basically, large/long lists of information that requires colums/rows to display them in an orderly fashion.

If I was to have one image say in the header and no text would I use another div or just use the header div to hold the image. Same question if it was just a paragraph of text inside the header.

If you don't have to have a div there, don't add it. Simpler code is better code -- easier to understand, which helps reduce mistakes.

Same question if it was just a paragraph of text inside the header.

If you have a paragraph of text, I'd usually suggest using the <p></p> (paragraph) tag, though again, if you don't have a reason to add it, don't.

Benjamin Falk | Falken Creative : Twitter
Skills: Photoshop, Illustrator, HTML, CSS, jQuery, PHP and CodeIgniter

Vote up Vote down

Re: deciding between divs within divs/ tables within divs

Thanks guys.

I'm starting to get it a bit.

What i did is since I removed the table from my center content div I had to add a floated left div and floated right div.
I thought that was not as simple as a single table element, but I don't know of any way to SPLIT one div into 2 columns.

My next problem is trying to figure out how to keep my footer at the bottom of my centered layout and STUCK to the bottom of my wrapper div that expands with the content.

I'll post separately for that.

Thanks again,
Ant

Vote up Vote down