Live data from Hacker News

CSS "text-overflow: ellipsis;" finally landed in Gecko

bugzilla.mozilla.org

11–20 of 28 posts

Re: CSS "text-overflow: ellipsis;" finally landed in Gecko

#13
post #4

"text-overflow: ellipsis" is a great start, but it's really too bad it only applies to individual lines of text (via "white-space: nowrap"). it would be very useful if we had a property to truncate text when it reaches the end of a container with a fixed height. so if the container is 3.5 lines tall, 3 lines should be shown with an ellipsis at the last character. bonus points if we can specify a separator, so that th…

I agree, it would be a lot more useful. Safari has an unsupported property (-webkit-line-clamp) that goes a little further but still limited. The fact that none of the browsers provides a way (no even vendor-prefixed) to do it makes me think that there are big technical hurdles.

I needed this desperately for a project I worked on last fall and ended up writing tons of JS which felt oh so wrong. Newspapers and magazines would LOVE to have that. Especially on mobile Safari. Especially on tablets.

Re: CSS "text-overflow: ellipsis;" finally landed in Gecko

#16
post #13
post #4

"text-overflow: ellipsis" is a great start, but it's really too bad it only applies to individual lines of text (via "white-space: nowrap"). it would be very useful if we had a property to truncate text when it reaches the end of a container with a fixed height. so if the container is 3.5 lines tall, 3 lines should be shown with an ellipsis at the last character. bonus points if we can specify a separator, so that th…

I agree, it would be a lot more useful. Safari has an unsupported property (-webkit-line-clamp) that goes a little further but still limited. The fact that none of the browsers provides a way (no even vendor-prefixed) to do it makes me think that there are big technical hurdles. I needed this desperately for a project I worked on last fall and ended up writing tons of JS which felt oh so wrong. Newspapers and magazin…

I imagine it's simply complex. Part of the box model involves expanding containers to fit the content within them, and properties like float, overflow, width, and height run counter to that. So what do you do with "expand this div to fit the text it contains, but also allow the text to be truncated if it doesn't fit, and remember to leave room for the ellipses"?

When you get into fancier concepts like truncating a set of lines, or only at certain word/phrase/sentence boundaries, you're into desktop publishing typesetting. To do that properly you're not just truncating when the container overflows, you're also adjusting the spacing between words and letters to make every line look consistent and to get as much of the text to fit neatly as you can. There aren't many pieces of software that professionals trust to do that well, and the ones that exist are expensive. We're not likely to see those algorithms getting into everyone's browser.

Re: CSS "text-overflow: ellipsis;" finally landed in Gecko

#17
post #5

I've been missing this feature in HTML for so long when making tables/overviews. Great to hear it's finally implemented.

Firefox is the only major browser that hasn't supported this. It even works in IE6.

Then I learned something new :)

Re: CSS "text-overflow: ellipsis;" finally landed in Gecko

#18

There is a way to get this working before FF5, it just involves a weird hack with an XML file. http://mattsnider.com/css/css-string-truncation-with-ellipsi... Yay for not needing this down the road.

That was one of the craziest hacks I've ever used on a production site. Glad this is finally implemented..

Re: CSS "text-overflow: ellipsis;" finally landed in Gecko

#19

There is a way to get this working before FF5, it just involves a weird hack with an XML file. http://mattsnider.com/css/css-string-truncation-with-ellipsi... Yay for not needing this down the road.

That was one of the craziest hacks I've ever used on a production site. Glad this is finally implemented..

Ditto. Had flashbacks of fixing stuff for IE6 that day.

Re: CSS "text-overflow: ellipsis;" finally landed in Gecko

#20
post #13
post #4

"text-overflow: ellipsis" is a great start, but it's really too bad it only applies to individual lines of text (via "white-space: nowrap"). it would be very useful if we had a property to truncate text when it reaches the end of a container with a fixed height. so if the container is 3.5 lines tall, 3 lines should be shown with an ellipsis at the last character. bonus points if we can specify a separator, so that th…

I agree, it would be a lot more useful. Safari has an unsupported property (-webkit-line-clamp) that goes a little further but still limited. The fact that none of the browsers provides a way (no even vendor-prefixed) to do it makes me think that there are big technical hurdles. I needed this desperately for a project I worked on last fall and ended up writing tons of JS which felt oh so wrong. Newspapers and magazin…

It can't be a completely intractable problem; iPhone apps have been able to do it since iOS 2.0.
Post reply on HN