css - Auto break line in HTML

Question

I've been doing a comment box and I have a problem after viewing my comment. All I want is to make my comment auto break line when it exceeds the container but what I've got right now is a straight line.

For example:

tttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt

I hope my text can be like this:

ttttttttttttt
ttttttttttttt 
ttttttttttttt 
ttttttttttttt 

What should I use to make my text auto break line?

Answer 1

It sounds like you're after word-wrap: break-word, and its cross-browser variants.

See: https://developer.mozilla.org/en/CSS/white-space

selector {
      word-wrap: break-word;      /* IE 5.5-7 */
      white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
      white-space: pre-wrap;      /* current browsers */
}

Demo: http://jsfiddle.net/MCj6s/