画面中央にボックスの中心を配置する方法

[PR] 容量300MB、月額125円、高性能なサーバが日本最大級のバックボーンに直結。さくらのレンタルサーバ。

　ウィンドウ画面の中央にボックスの中心を配置する方法の一つとして、以下のようにスタイルシートを２ステップで設定する方法があります。

　スタイルシートのポジションプロパティを絶対指定（absolute）にして、ボックス左上隅をウィンドウ画面中央にあわせる（top:50%; left:50%）。

　ボックスの縦と横の半分ずつだけ、マージンをマイナス方向へ設定する。

＜ウィンドウ画面に見立てた囲み＞

width:120px;
height:60px;

div.centerbox01 {
　width:120px;
　height:60px;
　position:absolute;
　top:50%;
　left:50%;
　margin-top:-30px;
　margin-left:-60px;
　background:#669933;
}