1

我正在使用以下 HTML （也在这个小提琴中）。

<div id="block1" class="Box"  style="width: 15%; height: 67; overflow-n: scroll;">
    block 1
</div><br/>
<TABLE CLASS="BODY" WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="NONE"> table 1 </TABLE>
<div id="block2" style="width: 20%; height: 67;top: 0; position: absolute;left: 25%;">
    block 2
</div> <br/> 
<table CLASS="BODY" WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="NONE" > table 2</table>
<div id="block3" style="width: 22%; height: 67;top: 0; position: absolute;left: 50%;">
    block 3
</div><br/>
<table CLASS="BODY" WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="NONE" > table 3</table>
<div id="block4" style="width: 25%;top: 0;  position: absolute;left: 75%; height: 67; display: inline-block;">
    block 4
</div><br/>
<table CLASS="BODY" WIDTH="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="NONE" > table 4</table>

我希望名为 block 1 block 2 block 3 block 4 的四个块水平地出现而不改变桌子的位置。

现在很好。所有的块都在正确的位置。

但是，如果存在其他一些 div，例如可以将其粘贴<div> position </div> 到小提琴的顶部。只有块 1 自动进入下一行，因为我力求为块 1 提供定位。我希望其他块 2、3、4 也可以进来行，如果存在一些 div。我们可以通过任何 CSS 属性来实现这一点吗？

注意：每个 Div 下有 4 个不同的功能

4

3 回答 3

0

这是因为你有 block2 - 4 绝对定位。这会将它们带出元素流，忽略开头的 div。

使用float或display:inline-block水平对齐 div，而不忽略“在它们前面”的任何标记。或者，您可以使用具有position:relative.

于 2012-07-20T08:48:17.540 回答
0

http://jsfiddle.net/kgVKw/6/ 那是你想要实现的吗？您的代码非常过分，您所需要的只是如果是这样

于 2012-07-20T08:49:59.277 回答
0

这是myFiddle只是用一个 div 定位相对..

于 2012-07-20T08:50:06.157 回答