css - 液体高度div内的css垂直对齐？

Question

我的css定位噩梦还在继续

<div id="divLeft">LEFT</div>
<div id="divRight">
    <div id="divTop">TOP</div>
    <div id="divCenter"><img id="imgC" src="http://cdn1.iconfinder.com/data/icons/Primo_Icons/PNG/128x128/button_blue_repeat.png"/></div>
    <div id="divBottom">BOTTOM</div>
</div>

CSS

#imgC{
    width:100px;
    vertical-align:middle; // doesn't work?
}  

如何保持图像垂直居中（注意：父 div 具有液体高度）。

这是jsfiddle

Answer 1

使用position:absolute负边距，在此处演示。

#imgC{
    width:100px;
    position:absolute;
    top:50%;
    margin-top:-50px;
}

我还看到您calc用于对齐顶部/中心/底部 div，您也可以在没有 IE6 兼容性的情况下实现这一点，calc并且仍然具有 IE6 兼容性。calc仅适用于最近的浏览器。