html - enclosing td inside div

I have a table and want to include a div inside it such that the div encloses some of the table rows. However it's not working.

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

<div style="color: yellow;">
<tr><td> two</td></tr>
<tr><td> three</td></tr>
</div>

<tr><td> four </td>&l开发者_C百科t;/tr>
</table>

Is it possible to enclose table rows within a div?

Many thanks for any suggestion provided.

---

Use the <tbody> tag to group rows together:

<table>
    <tr><td> one</td></tr>
    <tbody style="color: yellow;">
        <tr><td> two</td></tr>
        <tr><td> three</td></tr>
    </tbody>
    <tbody style="color: red;">
        <tr><td> four </td></tr>
    </tbody>
</table>

Test case.

---

No, that is not possible.

The only place where you can put any content in a table is inside the cells.

Perhaps you want a header and a footer in the table? Note that the footer comes before the body:

<table>
  <thead>
    <tr><td> one</td></tr>
  </thead>
  <tfoot>
    <tr><td> four </td></tr>
  </tfoot>
  <tbody style="color: yellow;">
    <tr><td> two</td></tr>
    <tr><td> three</td></tr>
  </tbody>
</table>

---

That would be invalid HTML.. so not possible.

you could instead add a class to the rows you want and use css to style it.

<table>
<tr><td> one</td></tr>
<tr class="colored"><td> two</td></tr>
<tr class="colored"><td> three</td></tr>
<tr><td> four </td></tr>
</table>

and in css

.colored td{ color: yellow; }

---

As mentioned in other answers you can use the <tbody> tag ^{w3c docs} for grouping, which allows for multiple instances in a table

<table>
    <tr><td> one</td></tr>
    <tbody class="colored">
        <tr><td> two</td></tr>
        <tr><td> three</td></tr>
    </tbody>
    <tr><td> four </td></tr>
    <tbody class="colored">
        <tr><td> five</td></tr>
        <tr><td> six</td></tr>
    </tbody>
</table>

demo http://jsfiddle.net/gaby/n2yWe/

---

It is possible (you just did it) but strongly not recommended since according to the w3c spec you cannot nest div under table. The browsers will probably act differently since no defined behaviour is required here.