Question

我希望'b'在'a'上平均分配：

[1        2         3        4]

如果没有足够的空间，那么'a'块会延伸到下一行。这是html结构，我想，但它不是固定的，可以修改。

<html>
    <head>
        <style>
            .a { width: 100%; border: 1px solid; float: left; }
            .b {  width: 100px; border: 1px solid red; float: left;}
        </style>
    </head>
    <body>
        <div class'a'>
            <div class='b'>1</div>
            <div class='b'>2</div>
            <div class='b'>3</div>
            <div class='b'>4</div>
        </div>
    </body>
</html>

Answer 1

我认为您正在寻找使用jQuery在此example中描述的智能列。您也可以尝试live demo。

Answer 2

你在说什么问题？当.a的宽度小于400px时，包装效果无法正常工作？我假设.a的高度在这种情况下不符合第4 .b div的底部。您可能需要在<br clear="all" />内.b之后添加.a。

Answer 3

也许最好的办法是将.b设为内联块并使其宽度为100％。

Answer 4

我认为你想要达到这个目的是正确的：

[[1   ][ 2  ][  3 ][   4]]

基本上给出了这个（隐藏了'b'边框）：

[1    2    3    4]

但是你有任意数量的固定宽度的内部物品，而外部容器是任意宽度的？

我不确定如果不钻研javascript就可以实现这一目标:(

如何沿容器的所有宽度分配div？

4 个答案: