divでvalignをmiddleにする方法

valignを使う時は癖があるので注意

divでvalignをmiddleに出来るということで、なかなか便利なので、メモしておきます。

HTML

<div class="sample1">
    <div>
        aaaa
    </div>
</div>

CSS

div.sample1 div{
    display:table-cell;
    width:100px;
    height:100px;
    vertical-align:middle;
}

最後に

valignを使いたい場面て結構多いと思うのですが、思い通りに効かなかったりして、もうちょっと簡単に使えないかなと思ったり。。