How to leave table td automatically increasing or decreasing the size according to the number of characters?

Question

How to leave table td automatically increasing or decreasing the size according to the number of characters?

Navigation

#1 by (1 votes)

2

How do I set% s of td to automatically increase or decrease the size by the number of characters? To prevent the text from ending up breaking line?

html css

asked by anonymous 14.12.2017 / 13:36

1 answer

Decode function e (+) Duplicating bootstrap menu

score 1 · Answer 1

I do not know if I understand this very well, but to avoid breaking lines, just set the white-space property of CSS as nowrap :

table tr > th,
table tr > td
{
  padding: 10px;
  border: #bbb 1px solid;
}

tr > td:first-child
{
  white-space: nowrap;
}

<table>
  <thead>
    <tr>
      <th>Texto sem quebrar</th>
      <th>Texto comum</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto texto</td>
      <td>Texto texto texto texto texto texto texto texto</td>
    </tr>
  </tbody>
</table>