Horje
How to edit HTML Table Row Height

To set the height of a specific row, add the style attribute on a table row element:


Basic Example of HTML Table Row Height

 <table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr style="height:200px">
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table> 

Full Example of HTML Table Row Height

Set the height of the second row to 200 pixels:
index.html
Example: HTML
<!DOCTYPE html>
<html>
<style>
table, th, td {
  border:1px solid black;
  border-collapse: collapse;
}
</style>
<body>

<h2>Set the height of the second row to 200 pixels</h2>

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Age</th>
  </tr>
  <tr style="height:200px">
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
</table>

</body>
</html>

Output should be:

Full Example of HTML Table Row Height





Related Articles
What is HTML Table Sizes HTML Table Sizes
How to edit HTML Table Width HTML Table Sizes
How to edit HTML Table Column Width HTML Table Sizes
How to edit HTML Table Row Height HTML Table Sizes

Single Articles
Basic Example of HTML Table Row HeightHTML Table Sizes
Full Example of HTML Table Row HeightHTML Table Sizes

Read Full:
HTML Table Sizes
Category:
Web Tutorial
Sub Category:
HTML Table Sizes
Uploaded:
1 year ago
Uploaded by:
Admin
Views:
49


Reffered: https://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_row_height

Share on: