CODEWITHSUNDEEP
htmlcsshtml-table
byCoder
byCoder

Reputation: 9184

CSS: in td (table) make all words from the new line

I have such code:

<table>
<tr>
  <th>#</th>
  <th>Text</th>
</tr>
<tr>
  <td>1</td>
  <td>Long Long cell content</td>
</tr>
<tr>
  <td>2</td>
  <td>Long Long cell content</td>
</tr>
</table>

and style:

table{
  border: 1px solid green;
}

fiddle: https://jsfiddle.net/t5rxtweo/

now it looks so on big resolution:

enter image description here

but on small:

enter image description here

and and small i wanna so:

enter image description here

can i do it with pure css?

Upvotes: 0

Views: 750

Answers (1)

Paran0a
Paran0a

Reputation: 3457

Can you define "small resolutions"?

Anyway here's a demo that you can play with.

https://jsfiddle.net/t5rxtweo/1/

@media screen and (max-width: 360px) {
    td {
        word-spacing: 9999999px;
    }
}

<table>
<tr>
  <th>#</th>
  <th>Text</th>
</tr>
<tr>
  <td>1</td>
  <td>Long Long cell content</td>
</tr>
<tr>
  <td>2</td>
  <td>Long Long cell content</td>
</tr>
</table>

Upvotes: 1

Related Questions