垂直居中

垂直居中，在实际应用中很多地方都会用到，当然也有很多方法可以实现，这里就说一种。

用一个高度100%  宽1px 的空标签
然后使用vertical-align: middle;
就可以在高度不固定的情况下 自动居中

<div class="test">
       <div>
            你是谁是大师傅大师傅大师傅大师傅士大夫首发式士大夫士大夫但是大师傅
            士大夫大师傅似的犯得上犯得上发射点士大夫士大夫
            发生的地方地方士大夫士大夫大师傅十分士大夫发似的发射点非法所得发发射点犯得上
      </div>
      <span></span>
</div>
.test{height: 300px;width: 500px; padding: 10px;border: 1px solid red;text-align: center;}
.test div{display: inline-block; padding: 3px;width: 200px;border: 1px solid #CCCCCC;vertical-align: middle;}
.test span{display: inline-block;height: 100%;width: 1px; vertical-align: middle;}