[PR] 容量300MB、月額125円、高性能なサーバが日本最大級のバックボーンに直結。さくらのレンタルサーバ。
画面中央にボックスの中心を配置する方法
ウィンドウ画面の中央にボックスの中心を配置する方法の一つとして、以下のようにスタイルシートを２ステップで設定する方法があります。
STEP1 左上隅を絶対指定で画面中央へ
スタイルシートのポジションプロパティを絶対指定（absolute）にして、ボックス左上隅をウィンドウ画面中央にあわせる（top:50%; left:50%）。
STEP2 マージンをマイナス方向へ
ボックスの縦と横の半分ずつだけ、マージンをマイナス方向へ設定する。
完成サンプル 横120px 縦60pxのボックスの場合
＜ウィンドウ画面に見立てた囲み＞
width:120px;
height:60px;
height:60px;
スタイルシートの例
div.centerbox01 {
width:120px;
height:60px;
position:absolute;
top:50%;
left:50%;
margin-top:-30px;
margin-left:-60px;
background:#669933;
}
