HTML tbody Tag

HTML tbody: Main Tips

• HTML tbody tags are used to turn a set of table rows into a table.
• A tbody element must contain at least one <tr> element.
• This element is used together with <thead> and <tfoot> tags.
• The table layout will not be affected by <tfoot>, <tbody>, <thead> elements. Style it using CSS.

Using the tbody Tag

HTML tbody tags define the data rows it contains as a table:

<table>
 <tbody>
  <tr>
    <td>Long Island</td>
    <td>45</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Geeky stuff</td>
    <td>85</td>
    <td>90</td>
  </tr>
  <tr>
    <td>StayAtHomeMart</td>
    <td>25</td>
    <td>30</td>
  </tr>
  <tr>
    <td>BestBuy</td>
    <td>60</td>
    <td>10</td>
  </tr>
 </tbody>
</table>

If the table includes a <thead> element, <tbody> has to be placed after it.

All table rows except footers and headers must be contained in a tbody element. You cannot have <tr> elements that are descendants of the <table> but aren't wrapped in tbody tags.

Note: you can use multiple tbody elements in a table to divide rows into sections. However, they must be consecutive.

Default CSS Settings

The <tbody> element will be displayed with these default values by most browsers:

tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
}

Deprecated tbody Tag Attributes

There were four tag attributes you could use with HTML tbody tags. However, they have been deprecated in HTML4.01 and removed completely in HTML5. Get to know them, but don't use them in your codes.

align defined the alignment of the content inside the <tbody> element:

<tbody align="right">

Note: instead of align, use CSS text-align property.

char set the alignment of the content inside the <tbody> element to a character:

<tbody align="char" char=".">

charoff specified the number of characters to offset the content from the character defined by char:

<tbody align="char" char="." charoff="2">

valign vertically aligned the <tbody> element content:

<tbody valign="bottom">

Note: instead of valign, use CSS vertical-align property.

Browser support

Mobile browser support