W3C home > Mailing lists > Public > www-style@w3.org > April 2012

Support cropping in the middle of texts using 'text-overflow'

From: Sebastian Zartner <sebastianzartner@gmx.de>
Date: Fri, 13 Apr 2012 18:55:11 +0200
Message-ID: <20120413165511.63590@gmx.net>
To: www-style@w3.org
There's a discussion at https://bugzil.la/740910 about how the CSS syntax of related to 'text-overflow' could be enhanced to allow putting an ellipsis in the middle of a text.

Currently there are two different approaches:

1. Extend the 'text-overflow' property:
The suggested syntax for this would be:

  text-overflow: ( clip | ellipsis | <string> ){1,3} [ <length>(1,2) ] | inherit;

where the optional <length> properties would define the minimum width of characters to stay (see below).
So as an example you could have:

  text-overflow: clip ellipsis clip;

which would render a text with an ellipsis in the middle.

As a text example for this imagine a file name:
this_is_a_very_long_filename.txt

Shrinked to the half of its size it would be:
this_is_…ame.txt


2. Add a new property 'text-overflow-end-offset':
The suggested syntax for this would be:

  text-overflow-end-offset: <percentage> | inherit;

where the <percentage> value defines the position of the end ellipsis.

So as an example you could have:

  text-overflow: clip ellipsis;
  text-overflow-end-offset: 50%;

which would render the text like in the first example.


Additionally we were talking about adding another property 'text-overflow-min-width', which controls the minimum amount of characters to stay when the text is cropped.

The suggested syntax for this would be:

  text-overflow-min-width: ( <length> ){1,2} | inherit;

where the <length> values define the minimium length of the text to stay.

So to stay with our example you could write:

text-overflow-min-width: 0 3ch;

So with only space for five characters in our file name example you would get:
t…txt


Besides this it was mentioned to define single-value properties for 'text-overflow'.

text-overflow-start
text-overflow-middle
text-overflow-end
text-overflow-min-width

Any thoughts on this?

Sebastian
-- 
Empfehlen Sie GMX DSL Ihren Freunden und Bekannten und wir
belohnen Sie mit bis zu 50,- Euro! https://freundschaftswerbung.gmx.de
Received on Monday, 16 April 2012 10:21:36 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:52 GMT