Question

我遇到了问题..

想象一下，我按照这个顺序得到了6个div：

DIV1,DIV2,DIV3,
DIV4,DIV5,DIV6

所以..我构建了一个Jquery脚本，允许我将其中一个Div移开.. 例：我可以将DIV2移开然后看起来像这样：

DIV1,DIV3,DIV4               DIV2 (anywhere out)
DIV5,DIV6

这是我的问题..我不想要，所有的div都向上移动，我想要这样的东西：

DIV1,    ,DIV3               DIV2 (anywhere out)
DIV4,DIV5,DIV6

一个分区的CSS：

float:left;
height:20px;
width:20px; 
border:1px solid white;
position: absolute;

background-color:Gray;
border: 1px solid WHite;

希望你们能帮助我:(

Answer 1

为了让你按照自己喜欢的方式工作，我认为你必须绝对定位每个盒子。

所以每个方框都必须有：

#Box1{
position:absolute;
top:0;
left:0;
}

#Box2{
position:absolute;
top:0;
left:150px;
}

另一种选择是让容器内的4个盒子中的每个盒子都不移动。我将整理一个快速演示。

<强>更新

以下是使用容器div来保持位置的演示：http://jsfiddle.net/fv2WQ/

Answer 2

您可以使用jQuery动态设置每个top的{{1}}和left属性：

http://jsfiddle.net/nSdpe/

.box

Answer 3

我会把div放在一个可以作为占位符的包装器中。

.wrapper{
float:left;
height:20px;
width:20px; 
padding:0px;
}

.content{
height:20px;
width:20px; 
border:1px solid white;
position: absolute;
background-color:Gray;
}

然后只将内容放在包装器

中

<div class="wrapper">
  <div class="content">
  </div>
</div>

但是，没有更多的代码，很难说什么会起作用，什么不行。

Div - CSS移动问题

3 个答案: