How to word wrap text in HTML?
You can use a soft hyphen like so:
aaaaaaaaaaaaaaa­aaaaaaaaaaaaaaa
This will appear as
aaaaaaaaaaaaaaa-
aaaaaaaaaaaaaaa
if the containing box isn't big enough, or as
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
if it is.
On bootstrap 3, make sure the white-space is not set as 'nowrap'.
div {
width: 200px;
word-break: break-all;
white-space: normal;
}
Try this:
div {
width: 200px;
word-wrap: break-word;
}
div {
/* Set a width for element */
word-wrap: break-word
}
The 'word-wrap
' solution only works in IE and browsers supporting CSS3
.
The best cross browser solution is to use your server side language (php or whatever) to locate long strings and place inside them in regular intervals the html entity ​
This entity breaks the long words nicely, and works on all browsers.
e.g.
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa​aaaaaaaaaaaaaaaaaaaaaaaaaaaaa