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ます。ごく最近のブラウザcalcでのみ動作します。