Sometimes, we want to force HTML table row on a single line with CSS.
In this article, we’ll look at how to force HTML table row on a single line with CSS.
How to force HTML table row on a single line with CSS?
To force HTML table row on a single line with CSS, we use the table-layout: fixed property.
For instance, we write
table {
table-layout: fixed;
}
td {
overflow: hidden;
white-space: nowrap;
}
to set table-layout to fixed to make the table cells’ widths fixed.
Then we use overflow: hidden; and white-space: nowrap; on the td elements to keep the cell content in 1 line and hide any overflow text.
Conclusion
To force HTML table row on a single line with CSS, we use the table-layout: fixed property.
