两列布局

时间:2012-11-16 13:14:17

标签: html css

这是我的版本:

<div>
    <div style="width:200px;float:left;display:inline-block;">
        123456789012345678901234567890123456789012345678901234567890123456789

    </div>
    <div style="margin-left:200px;">
        abcdefghijklmnopqrstuvwxyz 
    </div>
</div>

http://jsfiddle.net/EV6xF/

一切正常,直到文字很小:

enter image description here

我该如何解决?

1 个答案:

答案 0 :(得分:3)

word-wrap:break-word;添加到您的CSS规则中。

<div style="width:200px;float:left;display:inline-block;word-wrap:break-word;">

<强> (Demo)