Link text larger than parent

Question

I have a div, and inside that div is a link

<div class="something">
<a href="#">Databases</a>
</div>

The problem is that when I set the width of my div, smaller then the width that the text of the link is. the text of the link just goes outside of the parent div.

What I want is that the text breaks to a new line.

How can I fix this ?

Answer 1

Use the CSS word-break rule.

a {
    word-break:break-all;
}

jsFiddle example

Answer 2

Try this

a{
    white-space: pre-wrap;
    word-wrap: break-word; 
}

JsFiddle Demo