float 与 absolute

看过很多关于float与absolute的文章，其中不乏经典的解答。但是，前段时间，和朋友吃饭的时候，也聊到了这个问题。朋友是搞后台的，对这个区别，并不是很理解。在这里，我分享一个他能理解的说法。

特意写了个demo.html ，以具体的代码来做说明，截了个图。

<style type="text/css">
html{
font-size:20px;
}
body{
font-size:100%;
}
*{
margin:0;
padding:0;
}
.pull-left{
float:left;
}
.absolute-auto{
position:absolute;
top:0;right:0;bottom:0;left:0;margin:auto;
}
.form-box{
   position: fixed;
   top: 0;
   left: 0;
  width:400px;
  height:400px;
  border:10px solid blue;
   text-align: center;
   z-index: 101;
}
.xiaoding-form {
   color:#fff;
   text-align: center;
   border: 2px solid red;
   border-radius: 30px;
   background: #000;
}

</style>

<div class="form-box  " id="form_box" style="">
<div class="xiaoding-form  absolute-auto pull-left" >
井底小青蛙
</div>
我是小青蛙，我是一只井底小青蛙
</div>