Twenty Eleven: Words Break at Line Endings in Nested Comments in Firefox and IE

[chellycat]

Longer words in nested comments are breaking at the ends of lines in Firefox and IE. Steps to reproduce:

1. Activate Twenty Eleven on a test blog
2. Create a nested comment that's long enough to have multiple lines. Use this example text if you'd like: "Replying to this comment and want to see if the words will break. Momentarily waiting to see if words will break in wrong places and be moved continuously to a new line."
3. View the comment on the blog and observe how the words break strangely, without hyphens.

In r21487 (the fix for #21491), the following was added to Twenty Eleven:

 .commentlist .children li.comment .comment-content {
    margin: 1.625em 0 0; 
    -ms-word-break: break-all; 
    word-break: break-all; 
    word-break: break-word; 
    -webkit-hyphens: auto; 
    -moz-hyphens: auto; 
    hyphens: auto;
}

The "word-break: break-all" and "-ms-word-break: break-all" rules are causing longer words to break without hyphens. Please see attached screenshot for an example. This problem occurs in Firefox and IE9. Safari and Chrome both show hyphens.

What do you think about removing those two rules? Removing them allows the words to break with hyphens.

[lancewillett]

@chellycat Did you test out removing the two lines with super long URLs like in #21491?

[lancewillett]

Unfortunately the proposed fix breaks long URLs in IE9 and earlier. Not sure it's worth a trade-off. Testing out some more ...

[lancewillett]

word-break property was the culprit. 22751.2.patch should work with both long URLs and natural word breaks in all browsers.

[lancewillett]

In 23060:

Twenty Eleven: remove buggy word-break property, use word-wrap instead, for better hyphenation and word breaking in nested comments. Fixes #22751.

[lancewillett]

Noting for future reference, in order for CSS hyphenation to work correctly the blog's language must be set to match the post or page content. (US English = "en-US" for example.)

See notes in ​http://wordpress.org/support/topic/strange-word-breaks-in-posts-since-11-update?replies=8#post-3569034 and ​http://www.quirksmode.org/blog/archives/2012/11/hyphenation_wor.html