Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

<div> into a <tr>: is it correct?

Is this code correct?

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

    <tr>
        <div>...</div>
    </tr>

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

don't know for semantic (and W3C rules). What can you say about?

like image 307
markzzz Avatar asked Aug 13 '11 15:08

markzzz


People also ask

Can you put a div in a TR?

No, you cannot insert a div directly inside of a table.

Can you put a div in a TH?

<DIV> inside <TD> or <TH> is absolutely fine, and is reasonably common requirement for positioning & layout purposes.

Can I use div in TD?

If you use a div in a td you will however get in a situation where it might be hard to predict how the elements will be sized. The default for a div is to determine its width from its parent, and the default for a table cell is to determine its size depending on the size of its content.

Can I put div inside Tbody?

You can't. You'd have to create a new table row and then populate that with a table cell that spans the entire row, then put your DIV in there.


2 Answers

No it is not valid. tr elements can only contain th and td elements. From the HTML4 specification:

<!ELEMENT TR       - O (TH|TD)+        -- table row -->
<!ATTLIST TR                           -- table row --
  %attrs;                              -- %coreattrs, %i18n, %events --
  %cellhalign;                         -- horizontal alignment in cells --
  %cellvalign;                         -- vertical alignment in cells --
>
like image 120
Felix Kling Avatar answered Nov 03 '22 00:11

Felix Kling


Not only is it not valid, but it doesn't work! This mark-up

<table>
    <tr>
        <td>The First Row</td>
    </tr>

    <tr>
        <div>The Second Row</div>
    </tr>

    <tr>
        <td>The Third Row</td>
    </tr>    
</table> 

Produces this displayed

The Second Row
The First Row
The Third Row

The div is ejected entirely from the table and placed before it in the DOM

see http://jsfiddle.net/ELzs3/1/

like image 20
Alohci Avatar answered Nov 03 '22 01:11

Alohci