Previous Message
Next Message

Don't be ­

Sent by francky on 22 March 2006 00:12


Mark Johnson wrote:

>I have a question about hyphenation. There's a lot on the Web about
>non-breaking hyphenation. I want to be able to get line breaks only at
>existing hyphens in words.
>
>I work on a large biomedical database that regularly has long chemical names
>like
>
>(2R,6S,2'S)-6-methoxy-2-(6-methoxy-3-oxo-3,6-dihydro-2H-pyran-2-ylmethyl)-1-
>(toluene-4-sulfonyl)-1,6-dihydro-2H-pyridin-3-one
>
>If the text has just that name, Explorer, Safari, and Opera 9 line break
>the line at hyphens, but Mozilla
>doesn't. If I put ­ after each -, Mozilla *still* doesn't
>line break it, and IE adds an additional hyphen (as it probably should), so
>you get things like 6--
>dihydro, etc.
>
>Plus, Mozilla ignores ­. So ­ isn't useful for this.
>
>I do have a solution of sorts. Put <span class="sh"> </span> after
>each hyphen in the line, and then define
>span.sh {
>color: transparent;
>font-size: 0px;
>}
>
>With this approach, everything breaks fine everywhere. This technique
>might also be used to get URLs to line break. But it's... icky.
>
>Plus, I'll probably end up doing it in JS for technical reasons.
>
>I can find no -moz- rule that helps with this.
>
>Does anyone have a non-icky solution for this?
>  
>
Hi Mark,
An icy problem. To figure out what is happening, I made myself a 
testpage with your options and some more.
I see that your solution is good working in FF indeed , but not yet in 
IE and Opera (anyway, more I didn't test). Some small changes can help 
that, I experimented. [1] And I think you can miss the / class="sh" / in 
each separate span, if you put a general class in the containing box; 
and then .container span { ... }. With 5000 formula's it will save work 
& bandwidth! ;-) .
A beautiful solution I found at w3c, should be the Unicode 'zero width 
space' entity. - But for some reason I don't know, is seems to be 
history. - When I tested, it is working in FF at this moment though. Not 
in IE and Opera, but if you'll add the FF hyphen-construction by 
javascript, you can probably filter the others.
See testpage 
<http://home.tiscali.nl/developerscorner/css-discuss/test-hyphen.htm> 
and source code.

Being not an expert, that's all I can suggest. [2]
Greetings and good luck!
francky

[1] I tried also Netscape 6.2.1: the "hyphenbox 5" in the testpage is 
performing good, #6 has the gaps as in IE. - And the Gecko machine of 
Mozilla 1.7.1 is like FF: #5 and #6 both o.k.
[2] Or maybe a server-side script instead of javascript?




______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread: