How to fit table cell width to content with CSS?

Spread the love

Sometimes, we want to fit table cell width to content with CSS.

In this article, we’ll look at how to fit table cell width to content with CSS.

How to fit table cell width to content with CSS?

To fit table cell width to content with CSS, we set the cells’ width.

For instance, we write

<table style="white-space: nowrap; width: 100%">
  <tr>
    <td class="block" style="width: 50%">this should stretch</td>
    <td class="block" style="width: 50%">this should stretch</td>
    <td class="block" style="width: auto">this should be the content width</td>
  </tr>
</table>

to set the width of the last cell to auto to make the cell’s width fit to its content’s width.

Conclusion

To fit table cell width to content with CSS, we set the cells’ width.

Leave a Reply

Your email address will not be published.