html - 增加 float 元素的边距

Question

我有一个 .container因为有 n 个(left-block 和 right-block)div。
left-block向左浮动，right-block向右浮动。但是我在 1st left-block 之后没有得到 margin 和 right-block第二个left-block和 right-block
这是一个演示:JSBin

Answer 1

添加margin-top至 .left-block以及.right-block

Demo

.left-block {
  float:left;
  border:solid #CCC 1px;
  width:350px;
  height:125px;
  background:transparent;
  clear: right;
  margin-top: 10px;
  //position:relative;
}

.right-block {
  float:right;
  border:solid #CCC 1px;
  width:350px;
  height:125px;
  background:transparent;
  clear:right;
  //position:relative;
  margin-top: 10px;
}

P.S 删除 <br />标签，它们不是必需的。

---

上面会加上10px margin顶部框，为了摆脱它，使用下面的选择器。

.container > div:nth-of-type(1) {
  margin-top: 0;
}

.container > div:nth-of-type(2) {
  margin-top: 0;
}