日期:2014-05-17  浏览次数:20777 次

怎樣流式排版?右区自动切换到左对齐
___________________     ___________
|                                     |   |aaaaaaaaaa|
|左区范围200*100       |   |aaaa右区aa|
|                                     |   |aaaaaaaaaa|
|__________________|   |aaaaaaaaaa|
aaaaaaaaa右区自动切换到左对齐aaa|
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa|

怎样实现?

------解决方案--------------------
外边一个div
左div (写好宽度高度 float:left;padding:5px;)
右div (height:auto;)

当右div的高度大于左div时,会自动将内容延伸到左边去。


<div style= "width:300px; height:auto; background-color:#333; ">
<div style= "float:left;width:100px;height:50px;background-color:#EEE; "> left div </div>
<div style= "height:auto; "> right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right div right </div>
</div>


http://bolm.cn