Edit in JSFiddle

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="box elem">
    <span class="label begin"> &lt;div class="box"&gt; </span>
    <p>我在浮动！</p>
         <span class="label end"> &lt;/div&gt; </span>
</div>

<div class="after-box elem elem-orange">
    <span class="label begin"> &lt;div class="after-box"&gt; </span>
    <p>我在使用 clear，所以我不会浮动到上面那堆盒子的旁边。</p>
    <span class="label end"> &lt;/div&gt; </span>
</div>

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.elem{
    border:solid #6AC5AC 3px;
    position:relative;
}

.elem-orange {
    border: solid #FDC72F 3px;
}

.label{
    position:absolute;
    background-color:#6AC5AC;
    line-height:1em;
    padding:3px;
}
.elem-orange > .label{
    background-color:#FDC72F;
}
.begin{
    left:0;
    top:0;
}
.end{
    right:0;
    bottom:0;
}
p{
    margin:2em 0;
    display:block;
}
.box {
  float: left;
  width: 200px;
  height: 100px;
  margin: 1em;
}
.after-box {
  clear: left;
}