如何在换行符上包装长单词,并避免使用CSS进行水平滚动？

Question

我有以下的HTML:

<div class="box">
    long text here
</div>

和css:

.box {
    width: 400px;
    height: 100px;
    overflow: auto;
    border: 1px gold solid; 
}

我只想要一个垂直滚动.但是当一个单词太长时,会显示一个水平滚动.如何使长词包裹？

如果需要,我可以使用jQuery或PHP的技巧,但我想用CSS解决它,因为它是CSS的工作.

你可以在这里弄乱:http://jsfiddle.net/879bc/1/

Answer 1

word-wrap: break-word

https://developer.mozilla.org/en/CSS/word-wrap