Sometimes, we want to fix height of TR with CSS.
In this article, we’ll look at how to fix height of TR with CSS.
How to fix height of TR with CSS?
To fix height of TR with CSS, we set the elements inside the cells to the height we want.
For instance, we write
<table>
<tr>
<td class="container">
<div>
This is a long line of text designed not to wrap when the container
becomes too small.
</div>
</td>
</tr>
</table>
to add a table.
Then we write
td.container > div {
width: 100%;
height: 100%;
overflow: hidden;
}
td.container {
height: 20px;
}
to set the height of the td to 20% and set the div inside the td to fill the height of the trd with height: 100%;
.
Conclusion
To fix height of TR with CSS, we set the elements inside the cells to the height we want.