"Hard" word breaking / splitting in html / css

How can I split a long word/url at a certain point when displaying it in a html div?

It should be like:

thisisareallylongwordt 
hatneedstobebroken her
e o开发者_Python百科r something like th
at.

if you are wanting the word to break at the edge of the div rather than to overflow it use

div {word-wrap:break-word}

You need to manually insert <br> tags:

thisisareallylongwordt<br>
hatneedstobebroken her<br>
e or something like  th<br>
at

There is afaik no CSS solution as much as one would want one.

Edit: As Raoul suggested the soft-hyphen ­ works too. Did not know that existed myself.

Do you want a static word wrap or something more dynamic as the size of the div changes? If you want the latter then you will probably want to use javascript. The jQuery library has a word-wrap plugin:

http://plugins.jquery.com/project/wordWrap

Dan