user967451
user967451

Reputation:

How do I stop text running off screen and breaking layout without using CSS word-break property?

I have a comment section on my site where if the user presses and holds down a key like:

"aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"

The comment goes off the screen and breaks out of the layout. A solution is this:

.comment {
    word-break: break-all;
}

But unfortunately, this breaks all comments even normal ones like this:

I just came here to say tha
t the quick brown fox jumped ov
er the lazy dog.

How do I fix the first issue without causing the second?

Upvotes: 7

Views: 26943

Answers (1)

Manjunath Siddappa
Manjunath Siddappa

Reputation: 2157

use

 word-wrap: break-word;

css

.breaking{    
    width:500px;
    word-wrap: break-word;
}

http://jsfiddle.net/nbafbacL/

Upvotes: 13

Related Questions