如何定位div向左浮动但也向上浮动

Question

如何让div里面的Div向左浮动，没有空格;正如你在图像上看到的那样有空格，我正在使用这些代码;

main {position:relative;left:339.5px;top:40px;width:1018px;height:1000px;-webkit-box-shadow:inset 0px 0px 40px;}

main div {float:left;margin:1px;-webkit-box-shadow:inset 0px 0px 20px;}
#div_size1 {width:336px;height:200px;}
#div_size2 {width:336px;height:300px;}
#div_size3 {width:336px;height:100px;}


<main>
<div id="div_size1">
</div>
<div id="div_size2">
</div>
<div id="div_size3">
</div>
<div id="div_size3">
</div>
<div id="div_size3">
</div>
<div id="div_size2">
</div>
<div id="div_size2">
</div>
<div id="div_size1">
</div>
<div id="div_size2">
</div>
<div id="div_size3">
</div>
<div id="div_size3">
</div>
</main>

Answer 1

如果您发布HTML，我可以提供更多帮助。但看起来你想要漂浮的div上没有任何花车。

#div_size1 {float:left;width:336px;height:200px;}
#div_size2 {float:left;width:336px;height:300px;}
#div_size3 {float:left;width:336px;height:100px;}

Answer 2

如果您将位置更改为绝对位置，则可以更改其从顶部和侧面的距离：

main div {
  margin:1px;
  -webkit-box-shadow:inset 0px 0px 20px;

  position:absolute;
  left: 0px;
  top: 0px;
}

希望这有帮助

Answer 3

如果你想要它修复，如果我正在构建这个布局，我会有2＆＃34; colum＆＃34; div的。第一个是2盒宽。而另一个则是1盒宽。左和右。右边的5个框将位于右列div中。然后在左栏中我将进一步分开。我会把2＆＃34; row＆＃34; div的。底部将有底部1框（div_size3）。然后在顶行我将通过插入2个colum div来分隔它。左边有3个盒子，右边有2个盒子。