絶対配置時にmargin autoで中央寄せになるやつ

@Takazudo

なにそれ

コレ

http://codepen.io/takazudo/pen/oXRqNG

CSS

.lv1 {
  width: 400px;
  height: 400px;
  position: relative;
}
.lv2 {
  width: 200px;
  height: 240px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

なぜ中央に寄るのか？

ここに書いてある

CSS basic box model - 幅、高さ、マージンの計算 - 絶対配置された非置換要素

• CSS basic box model

縦

以下全部足したのが包含ブロックの高さと等しくなる

• top
• margin-top
• border-top-width
• padding-top
• height
• padding-bottom
• border-bottom-width
• margin-bottom
• bottom
• スクロールバーの高さ（もしあれば）

横

以下全部足したのが包含ブロックの幅と等しくなる

• left
• margin-left
• border-left-width
• padding-left
• width
• padding-right
• border-right-width
• margin-right
• right
• スクロールバーの幅（もしあれば）

auto奥が深かった

おわり