The height of rows ‘tr’ in a table can be fixed very easily. This can be done by adding the height attribute in the tr tag. If the height is not specified, the height of the row changes according to the content. The height can be specified either in pixels, or percentage.
<tr height="px | %">
- The height attribute is used to set the height of a row. It is added in the <tr> tag.
- The height should be specified according to the content, either in pixels or percentage.
- If the content in the row is large, it will overflow.
Example: In this example, the height of the first row has been fixed, but the height of the second row has not been. So, when we vary the size of the screen, the height of the first row remains the same, but the height of the second-row changes according to the content. However, if the specified height is not sufficiently large according to the content, this may not work, and the first row will overflow and behave similarly to the second row.
Run the following code and vary the screen-size to see the difference between both the rows:
- Before decreasing screen-size:
- After decreasing screen-size:
- How to fix the width of columns in the table ?
- HTML width/height Attribute vs CSS width/height Property
- How to Fix a 401 Unauthorized Error?
- How to Fix Race Condition using Atomic Functions in Golang?
- How to fix number of visible items in HTML dropdown and allow multiple selections ?
- Underscore.js _.fix() Method
- Lodash _.fix() Method
- Space between two rows in a table using CSS?
- HTML | DOM Table rows Collection
- How to Dynamically Add/Remove Table Rows using jQuery ?
- How to Count Number of Rows and Columns in a Table Using jQuery?
- How to apply CSS page-break to print a table with lots of rows?
- How to create table with 100% width, with vertical scroll inside table body in HTML ?
- How to add table row in a table using jQuery?
- How to remove table row from table using jQuery ?
- How to make Bootstrap table with sticky table head?
- How create table without using <table> tag ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.