The width attribute in the <th> tag is used to specify the width of a header cell. It was commonly used in older HTML but is now deprecated in HTML5.
- Specifies the width of a header cell.
- Value can be in pixels or percentage.
- Used only with the <th> element.
Note: The width attribute is deprecated in HTML5; use CSS (width) instead.
Syntax
<th width="pixels | %">Attribute Values
- pixels: Sets the width of the header cell in pixels.
- %: Sets the width of the header cell in percentage (%).
Example: In this example, the <th> width attribute sets column widths to 50%, 20%, and 30% of the table.
<!--Driver Code Starts-->
<!DOCTYPE html>
<html>
<head>
<title>
HTML th width Attribute
</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>HTML th width Attribute</h2>
<!--Driver Code Ends-->
<table border="1" width="500">
<tr>
<th width="50%">NAME</th>
<th width="20%">AGE</th>
<th width="30%">BRANCH</th>
</tr>
<tr>
<td>Ben</td>
<td>22</td>
<td>CSE</td>
</tr>
<tr>
<td>Ron</td>
<td>25</td>
<td>EC</td>
</tr>
</table>
<!--Driver Code Starts-->
</body>
</html>
<!--Driver Code Ends-->
Example: In this example, the <th> width attribute sets 100px for “Header 1,” 200px for “Header 2,” and the remaining space for “Header 3.”
<!--Driver Code Starts-->
<!DOCTYPE html>
<html>
<head>
<title>Table with th Width Attribute</title>
<style>
body {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
</style>
</head>
<body>
<h1 style="color: green;">GeeksforGeeks</h1>
<!--Driver Code Ends-->
<table border="1">
<tr>
<th width="100">Header 1</th>
<th width="200">Header 2</th>
<th>Header 3</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
<td>Data 3</td>
</tr>
</table>
<!--Driver Code Starts-->
</body>
</html>
<!--Driver Code Ends-->