当li高度可动态改变时，li中的DIV始终保持垂直居中。

由于高度不固定，不能用margin或者padding解决。

最头疼的是vertical-align: middle;也莫名其妙的失效了。

 

最终想到了相对定位这个办法,简单代码如下：

 

    
      
        
       
DIV里面的内容
    
      
.aaa{  height:100%;  position: relative;}.bbb{  position: absolute;  top: 50%;  margin-top: -22px;}

 

代码解释：

top: 50%; 作用是利用相对定位实现垂直居中。但是设置之后，元素会稍有偏差。

margin-top: -22px;作用把偏差调整回来，（-22px只是举例子，实际大小按照样式设定）。

 

到这里可能有人会问，为什么不直接在top中调整，而需要另外添加margin-top来调整呢，因为如果top不是50%的话，比如30%，那么随着li的高度变化，DIV实际在li里面的高度就会越接近真正的30%位置。利用margin-top来调整不会出现该现象。如果有什么描述的不对，欢迎评论指出，本人还是程序员小白~