XHTML correct syntax

Question

Hello, I have a question. I am developing a card board which is 4x3. So I have tryed to do markup with XTHML Transitional. I have used containers mixed with tables. The example for first row:

<table>
 <tr>
   <div class="slot_01"></div>
   <div class="slot_02"></div>
   <div class="slot_03"></div>
   <div class="slot_04"></div>
 </tr>
 <tr>
 ...
 </tr>
</table>

Is this correctly done? Or its better to use only div/span blocks instead everywhere and make styling through css?

Answer 1

No, You need td's in there, like this:

<table>
<tr>
<td></td>
<td></td>
</tr>
</table>

If you really need to, put your divs inside the TDs.

Answer 2

Ideally use div/span blocks if you can, but the above code is ok, you just need to wrap each div in a td element:

<table>
 <tr>
   <td><div class="slot_01"></div></td>
   <td><div class="slot_02"></div></td>
   <td><div class="slot_03"></div></td>
   <td><div class="slot_04"></div></td>
 </tr>
 <tr>
 ...
 </tr>
</table>

Answer 3

If you use a table, use table, tr, td, not div.

I think most people nowadays try to avoid tables for anything but "really tabular data" and prefer the "pure CSS" solution.

It depends a bit on your overall markup (e.g. what you want to display in the cells). In your case, I guess I would go for a tableless solution.

Answer 4

If your data is tabular in nature there's nothing wrong with using tables. Everyone else is correct - you need to use table cells instead of the divs in your sample code.

Answer 5

For the lay out of the entIre page I would do it tableless. Remember: XHTML is for structure, CSS for displaying the structure.