RedLine Magazine::CSSビギナー向け 陥りがちな罠 Vol.01サンプル

左寄せの場合

div id="sample01"

上の黄緑のボックスはtopから100px、leftから50pxの位置に指定してあります。
問題なく指定のとおりになっています。
>>このまま問題の中央揃えすると・・・

CSSソース

body{
	background:#ffffec;
	}
#container{
	width:60%;
	border:1px solid #900;
	}
#sample01{
	position:absolute;
	top:100px;
	left:50px;
	width:150px;
	height:150px;
	background:#9c0;
	}

htmlソース

<div id="container">
<div id="sample01">
<p>div id="sample01"</p>
</div>
</div>

>>次のページ:中央寄せの場合・問題編へ

>>CSSビギナー向け 陥りがちな罠Vol.01へ戻る