Question

我有一组对象（ divs ）是小方块，我可以在任何地方移动（然后有一个JavaScript函数可以移动）。那些正方形都在一起形成一个数字。所以我把这个数字集中在CSS上：＆＃34; left: 600px＆＃34;但现在我试图为我的页面设计一个响应更快的设计，我开始有百分之一，但我遇到了两个问题。

如果我单独为所有对象添加百分比，当我放大或缩小时或当我调整页面大小时，它们会彼此远离更近。
如果我创建一个包含所有对象的div，然后添加＆＃34; left:50%＆＃34;当我点击移动它们时，它们会立即再向左移动50％。所以我的鼠标就是这个 - ＆gt; （）[spacespacescpace] / \＆lt; - 这是对象，但我还在选择那个对象。这太奇怪了......

这是HTML：

<div id="container">
<div class="VEPart" id="me2"></div>
<script type="text/javascript">
    jcl.LoadBehaviour("me2", MoverBehaviour);
</script>


<div class="VEPart" id="me3"></div>
<script type="text/javascript">
    jcl.LoadBehaviour("me3", MoverBehaviour);
</script>

<div class="VEPart" id="me4"></div>
<script type="text/javascript">
    jcl.LoadBehaviour("me4", MoverBehaviour);
</script>   

<div class="VEPart" id="me5"></div>
<script type="text/javascript">
    jcl.LoadBehaviour("me5", MoverBehaviour);
</script></div>

这里是CSS：

#me2
{
  content:url("some image");
  top:401px;
  left:0px;
  z-index:5;  
}

#me3
{
  content:url("some image");
  top:400px;
  left:-58px;
  z-index:5;    
}

#me4
{
  content:url("some image");
  top:400px;
  left:58px;
  z-index:5;    
}

#me5
{
  content:url("some image");
  top:500px;
  left:-57px;
  z-index:5;    
}

Answer 1

尝试将position属性设置为absolute并使用百分比。听起来你有相对定位的问题。

#me2
{
  content:url("some image");
  position:absolute;
  top:401px;
  left:50%;
  z-index:5;  
}

http://www.w3schools.com/cssref/pr_class_position.asp

Answer 2

为所有div提供样式.. 把它放在你的CSS中

div {
 margin-left: 20%
}

如何使用CSS将HTML组中的一组对象集中在一起？

2 个答案: