Left
要素を配置する左や右からの位置を指定します。
このプロパティを実行する場合、要素にPOSITIONプロパティでABSOLUTEかRELATIVEを指定していなければなりません。
RIGHTは、IE5.0から対応しています。
●関連プロパティ
POSITION | TOP & BOTTOM | WIDTH | HEIGHT
{ left : absolute size | percentage | auto }
{ right : absolute size | percentage | auto }
左端から数値で指定
要素を配置する左からの位置を、数値で指定します。
サンプルは、左から80pxに<DIV>を配置しました。背景画像の罫線ピッチは、10pxです。
{ left : length in | length cm | length mm | length pt | length pc | length px }
<div style="position: relative; height: 60px; width: 300px;">
<div style="left: 80px; position: absolute; width: auto;
height: auto;">Left 80px</div>
</div>
左端からパーセントで指定
要素を配置する左からの位置を、パーセントで指定します。
サンプルは、高さ80pxの親要素の<DIV>の中に、左から50%の位置に<DIV>を配置しました。親の高さ80pxですから、左から40pxの位置になっています。
{ left : Percentage }
<div style="position: relative; height: 60px; width: 300px;">
<div style="left: 50%; position: absolute; width: auto;
height: auto;">Left 50%</div>
</div>
右端から数値で指定
要素を配置する右からの位置を、数値で指定します。
サンプルは、ページの右から80pxに配置しました。背景画像の罫線ピッチは、10pxです。
{ right : length in | length cm | length mm | length pt | length pc | length px }
<div style="position: relative; height: 60px; width: 300px;">
<div style="Right: 80px; position: absolute; width: auto;
height: auto;">Right 80px</div>
</div>
右端からパーセントで指定
要素を配置する右からの位置を、パーセントで指定します。
サンプルは、ページの左から25%の位置に配置しました。ページの幅400pxですから、右から60pxの位置になっています。
{ right : Percentage }
<div style="position: relative; height: 60px; width: 300px;">
<div style="right: 20%; position: absolute; width: auto;
height: auto;">Right 20%</div>
</div>
 |
 |
|---|
