忍者ブログ
18 August

高さ不明の要素に対して天地中央に配置

<div>
<img src~~~>
</div>


img {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

いろんなやり方があるがいまいち実践でしっくりこない
上記のやりかたをやってもうまくいかない場合はよくある
widthやheightをちゃんと指定しなきゃいけなかったりして、可変だから中央寄せしたいのに、widthとheightが定まらないからやりたいんだよ
定まってたら中央にするのにそんな一生懸命にならねーよ

というわけで、下記サイトのどれかを使う

http://blog.mismithportfolio.com/web/20151027cssimageplace
http://demo.mismithportfolio.com/test18/

PR