How to make div break line?

Question

I have the following code:

.thing {
  width: 90%;
  height: 400px;
  border: 10px solid #000;
}

<div class="thing">
  aaaaaaaaaaaa
</div>

The problem is that when I add to much content, the text goes out of the div!

How to fix this using only CSS?

`padding: 10px solid #000;`........just to verify, you mean **border** right? — Riskbreaker, Jun 11 '13 at 16:41

score 14 · Answer 1 · answered Jun 11 '13 at 16:38

14

.thing {
width: 90%;
height: 400px;
padding: 10px solid #000;
word-break:break-all;
}

use word-break

answered Jun 11 '13 at 16:38

Bhushan Kawadkar

What is the difference between breakall and breakword? – Luis Parker Jun 11 '13 at 16:43
break-all will move your word to next line if it does not fit into container width but break-word will break the word to make it fit into container width. see this link http://stackoverflow.com/questions/1795109/what-is-the-difference-between-word-break-break-all-versus-word-wrap-break – Bhushan Kawadkar Jun 12 '13 at 11:02

score 4 · Answer 2 · answered Apr 14 '14 at 09:48

4

this happen coze you are not adding space

just add a space some where between 'aa' like this > 'aaaaaa aaaaaa' there is not word with 12 character

but if you need this long word then use

word-break:break-all;

answered Apr 14 '14 at 09:48

fahd4007

2 Answers2