Categories
CSS

How to word-wrap in an HTML table with CSS?

Spread the love

To word-wrap in an HTML table with CSS, we set the word-wrap property.

For instance, we write

<table style="table-layout: fixed; width: 100%">
  <tr>
    <td style="word-wrap: break-word">
      LongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongLongWord
    </td>
  </tr>
</table>

to set the word-wrap property to break-word to break long words into new lines.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *