2 replies [Last post]
David Beamish
David Beamish's picture
Offline
newbie
Last seen: 12 years 23 weeks ago
Joined: 2009-12-07
Posts: 2
Points: 3

I have tabulated information in two columns on a web page. I would like the left-hand column to be just wide enough to hold the longest piece of text, so that any wrapping takes place in the right-hand column. So far as I can tell, the "white-space: no-wrap" property would have to be applied separately to individual cells. Is there a way of avoiding this? It seems that CSS does not generally recognise table columns.
I have a couple of workarounds, but neither is ideal:
(1) Set the width of the left-hand column in HTML or XHTML. But if it is just wide enough in my browser then it may be insufficiently wide in someone else's!
(2) In the longest cell in the left-hand column, make all the spaces non-breaking. But, as I generate the table from a database, I'd have to make all the spaces non-breaking, and I'd like to avoid that.
Any advice gratefully received!

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 8 years 11 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

if you don't need to support

if you don't need to support IE6 you could apply the no-wrap to all the first cells of each row:

td:first-child {white-space: no-wrap;}

David Beamish
David Beamish's picture
Offline
newbie
Last seen: 12 years 23 weeks ago
Joined: 2009-12-07
Posts: 2
Points: 3

Can I prevent one column in a table from wrapping?

Many thanks. With a small tweak ("nowrap" not "no-wrap") this worked beautifully!