自动换行不适用于浮动文本

Question

假设我有这个.

<div>
<div id="lala">
lalalala
</div>
</div>

CSS:

#lala
{
   float:left;
   word-wrap:break-word;
}

如果里面的文字#lala很大,它会是这样的.

|                              |
|                              |
| lalalalalalalalalalalalalala | lalalalalala <-- these won't be show.
|                              |
|                              |

如果我删除float:left;这将是结果.

|                              |
|                              |
| lalalalalalalalalalalalalala |
| lalalalalala                 |
|                              |

如何在使用float时获得第二个结果？

Answer 1

给元素一个固定的宽度,以便我们知道在哪里打破这个词:

#lala
{
float:left;
word-wrap:break-word;
width:?px;
}

word-wrap:break-word属性应仅在元素具有可视化渲染时应用,是具有显式高度/宽度的内联元素,绝对定位和/或是块元素.