CODEWITHSUNDEEP
htmlcsshtml-table
Gnubie
Gnubie

Reputation: 2607

Wrap text consistently in table cells

I have an HTML table with a column of cells containing two parts e.g.

| Cat (meow)                |
+---------------------------+
| Long-dinosaur-name (roar) |

There are also other columns not shown. My users' browsers have unknown widths. On a wide one, I wish to show the cell as one line, as above. If it gets too narrow, I'm fine with wrapping

| Cat      |
| (meow)   |
+----------+
| Long-    |
| dinosaur-|
| name     |
| (roar)   |

but if one line wraps, all lines must also wrap:

| Cat                 |
| (meow)              |
+---------------------+
| Long-dinosaur-name  |
| (roar)              |

Without using Javascript, is it possible to do this?

I know I can use <td nowrap> to prevent wrapping, or <br> to force a wrap, but how can I make one cell depend on another?

Upvotes: 0

Views: 60

Answers (1)

adnan tariq
adnan tariq

Reputation: 197

Try using media query(CSS) with breakpoints. I know you said, the user browsers width's are unknown, but you can anticipate for different width's etc

Upvotes: 1

Related Questions