HTML <td> tag

HTML <td> tag is used to specify the cells of an HTML table which contain data of the table. The <td> tag must be the child element of <tr> (table row) tag. Each table row can contain multiple <td> data elements.

The grouped <td> elements of a <tr> tag renders as a single row in the table. The content of the <td> elements is regular and left-aligned in the table by default.

Syntax


DisplayInline
Start tag/End tagStart and End tag
UsageTable content

Example

Test it Now

Output:

HTML td tag

Fixed column width using <td> tag in a table

In an HTML table, the dimensions of the rows and columns in a table are automatically adjusted by the browser so that the contents fit in the row. However, there can be a situation where the width of the columns needs to be fixed or equal-sized. So there are various techniques to fix the width of the column.

<td> tag width attribute: The <td> tag width attribute is used to fix the width of a particular column. With this, we can assign a numeric value to this attribute or in terms of percentage.

Following is an example of fixing the column width using the <td> tag width attribute.

Example 1

Explanation:

In the above example, we have created an example of fixing the column width using the <td> tag width attribute.

Output:

Following is the output of this example.

HTML td tag

Example 2:

Explanation:

In the above example, we have created an example of equal size column width using <td> tag.

Output:

Following is the output of this example.

HTML td tag

Fixed column width using <col> tag in a table

<col> tag: The <col> tag in a table is used to fix the width of a particular column. With this, we can assign a numeric value to this attribute or in terms of percentage.

Following is an example of how to fix the column width using the <col> tag.

Example 1:

Explanation:

In the above example, we have created an example of fixing the column width using the <col> tag.

Output:

Following is the output of this example.

HTML td tag

Attribute:

Tag-specific attributes:

AttributeValueDescription
abbrtextIt defines the abbreviated version of content of the cell. (Not Supported in HTML5)
alignleft
right
center
justify
char
It specifies the alignment of the content of the cell. (Not Supported in HTML5)
axiscategory_nameIt Categorizes Cells. . (Not Supported in HTML5)
bgcolorrgb(x,x,x)
#xxxxxx
Color_name
It sets the background color of the cell. (Not Supported in HTML5)
charcharacterIt specifies the alignment of the content of cell to the character. (Not Supported in HTML5)
charoffnumberIt determines the number of characters the content aligned from the character specified by the char attribute. (Not Supported in HTML5)
colspannumberIt determines the number of columns a cell should span.
headersheader_idIt determines one or more header cells to which a cell is related.
height%
pixels
It determines the height of a table cell. (Not Supported in HTML5)
nowrapnowrapIf it sets then content inside the cell should not wrap. (Not Supported in HTML5)
rowspannumberIt determines the number of rows a cell should span.
scopecol
colgroup
row
rowgroup
It specifies the cells that the header element relates to. (Not Supported in HTML5)
valigntop
middle
bottom
baseline
It determines the vertical alignment of the cell content. (Not Supported in HTML5)
width%
pixels
It determines the width of the cell.(Not Supported in HTML5)

Global attribute:

The <td> tag supports the Global attributes in HTML.

Event attribute:

The <td> tag supports the Event attributes in HTML.

Supporting Browsers

Elementchrome browser Chromeie browser IEfirefox browser Firefoxopera browser Operasafari browser Safari
<td>YesYesYesYesYes