以前, 『CSS でテキストの縦揃えを上揃え, 中央揃え, 下揃えにする方法 | phiary』というエントリーを書きました. このエントリーで紹介した中央揃えにする方法は, 複数行ある要素だと高さに合わせて CSS を書き換える必要がありました. 今回は, 高さが不確定な要素でもキレイに中央揃えにする方法を紹介します. How to やり方について解説します. まずセンタリングしたい要素の親要素に対して, position:absolute; を指定します. 今回でいうと .box ですね. .box { position: aboslute; ... } 次に, センタリングしたい要素に対して下記のように指定します. .box p { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-trans
![phiary](https://cdn-ak-scissors.b.st-hatena.com/image/square/a296351ed3720e0115678d3acec46b79e021cae0/height=288;version=1;width=512/https%3A%2F%2Fwww.evernote.com%2Fl%2FAOLx113DZFhLAa8brY-YhavXvFpOnB0Yu6AB%2Fimage.png)