0

I have a DIV container which used to display the text included by users. But, I have a problem when the users try to add long text without adding white-space(Ex: balalalalalalalala...) inside the text or that text is in Unicode character, so, it will display only one line overflow my DIV container.

I want that to add a break line automatically by itself. How to do that?

Thanks :)

Yong
  • 39
  • 1
  • 7

2 Answers2

0

If you're down with CSS3 you may try the 'word-break' property.

To see a demo:

http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_word-break

asafreedman
  • 572
  • 4
  • 10
0

The CSS word-wrap property is compatible with older browsers (IE 5.5+, FF 3.5+, Chrome 1.0+, Safari 1.0+, Opera 10.5+).

CSS:

div { word-wrap: break-word; }

Here's a fiddle.

That should work if white-space doesn't, otherwise just use white-space: pre-wrap.

Alex W
  • 37,233
  • 13
  • 109
  • 109
  • Thank you so much !! This helps me a lot, but can you please explain me what the difference between "word-break:break-all" and "word-wrap: break-word" is?? I just want to know that. :) thanks again. ;) – Yong Jun 23 '13 at 03:10
  • @VyEm http://stackoverflow.com/questions/1795109/what-is-the-difference-between-word-break-break-all-versus-word-wrap-break – Alex W Jun 23 '13 at 04:15