Sometimes, we want to set table columns to have auto width with CSS.
In this article, we’ll look at how to set table columns to have auto width with CSS.
How to set table columns to have auto width with CSS?
To set table columns to have auto width with CSS, we set the white-space property.
For instance, we write
<tr>
<td class="fit-width">ID</td>
<td>Description</td>
<td class="fit-width">Status</td>
<td>Notes</td>
</tr>
to add the table.
Then we write
td.fit-width {
width: 100px;
white-space: nowrap;
}
to add white-space: nowrap;
to make the text wrap if it overflows the width in each cell.
Conclusion
To set table columns to have auto width with CSS, we set the white-space property.