HTML <td> width Attribute
Last Updated :
11 Jul, 2025
The HTML <td> width attribute was traditionally used to specify the width of a table cell. If this attribute is not set, the cell automatically adjusts its width based on the content it contains. This attribute provides flexibility as it accepts values in both pixels and percentages, allowing developers to control the layout and responsiveness of the table element.
However, it is important to note that the <td> width attribute is not supported in HTML5. We have new ways now that favor the use of CSS for styling table elements, including specifying width.
Note: The <td> width Attribute is not supported by HTML5.
Syntax
<td width="pixels | %">
Attribute Values
Attribute Values | Descriptions |
|---|
pixels | It sets the width of the table in terms of pixels. |
% | It sets the width of the table in terms of percentage (%). |
Example 1: Using Pixels for <td> Width
In the following example, we set the width of the first column in pixels.
html
<!DOCTYPE html>
<html>
<head>
<title>
HTML td width Attribute
</title>
</head>
<body>
<center>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3 style="color: crimson;">
HTML td width Attribute
</h3>
<table border="1" width="500">
<tr>
<th>NAME</th>
<th>AGE</th>
<th>BRANCH</th>
</tr>
<tr>
<td width="50%">BITTU</td>
<td width="20%">22</td>
<td width="30%">CSE</td>
</tr>
<tr>
<td>RAKESH</td>
<td>25</td>
<td>EC</td>
</tr>
</table>
</center>
</body>
</html>
Output:
Example 2: Using Percentage for <td> Width
In this example, we set the width of the first column as a percentage of the total table width.
HTML
<!DOCTYPE html>
<html>
<head>
<title>
HTML td width Attribute
</title>
</head>
<body>
<center>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3 style="color: crimson;">
HTML td width Attribute
</h3>
<table border="1" width="80%">
<tr>
<th>NAME</th>
<th>AGE</th>
<th>BRANCH</th>
</tr>
<tr>
<td width="40%">BITTU</td>
<td width="30%">22</td>
<td width="30%">CSE</td>
</tr>
<tr>
<td width="60%">RAKESH</td>
<td width="20%">25</td>
<td width="20%">EC</td>
</tr>
</table>
</center>
</body>
</html>
Output:
Important Note on HTML5
The <td> width attribute is deprecated in HTML5, meaning it is no longer supported in modern web development. Instead of using the width attribute in the <td> element, developers should now use CSS to control the width of table cells for better styling and responsiveness.
Here’s an example of how to set the width of a table cell using CSS:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Table Cell Width Using CSS</title>
<style>
td {
width: 200px; /* Example of setting width in CSS */
}
</style>
</head>
<body>
<table border="1">
<tr>
<td>Cell with width set using CSS</td>
<td>Another cell</td>
</tr>
<tr>
<td>Cell with width set using CSS</td>
<td>Another cell</td>
</tr>
</table>
</body>
</html>
Output:
Supported Browsers
- Google Chrome 1 and above
- Microsoft Edge 12 and above
- Firefox 1 and above
- Opera 12.1 and above
- Safari 1 and above
HTML is the foundation of webpages, is used for webpage development by structuring websites and web apps.You can learn HTML from the ground up by following this HTML Tutorial and HTML Examples.
HTML <td> width Attribute