[CSS] 세로 가운데 정렬 Vertical-align:center

<div id="box">
    <div id="text">가운데 정렬</div>
</div>

#box { width:400px; height:300px; background:#f0e0e0; }
#text { position:relative; top:50%; transform:translateY(-50%); text-align:center; }

가운데 정렬