ボックスの配置方法

説明

position: position; C2- ie4- N4-

値:	static \| relative \| absolute \| fixed \| inherit

初期値：static、適用要素：すべて(内容の追加 content、quotesプロパティは除く)、継承：しない、%値：なし、メディア：ビジュアル

positionは、包含ブロック内におけるボックスの表示位置を決定するための配置方法を設定するプロパティです。実際の表示位置は、ボックスの位置指定を行うtop、bottom、left、rightプロパティを用いて指定します。

位置指定には、負の値を指定することもできます。

*1 positionプロパティを指定されたマージンを有する要素(h1-h6, p, blockquote, ul, fieldset, form, ol, dl, dir, menu)は、ieとそれ以外のブラウザで微妙にレンダリングが異なります。具体的には、ieにおいてページ最上部のマージンは無視され、左右のマージンは維持されます(blockquote, menu)。それ以外のブラウザにおいては、すべてのマージンが維持されます。　

HTML 4.0のためのデフォルト・スタイル・シート

使用例


#hint {position:absolute; top:100px; left:100px}

position プロパティの値

static	C2- ie4- N4- 配置方法を指定しない通常の状態にします。この値を指定した際には、top、bottom、left、rightプロパティは適用されません。初期値。
relative	C2- ie4- N4- 相対配置。通常の配置からの相対位置に配置するようにします。後に続くボックスは、通常の配置位置に配置されます。
absolute	C2- ie4- N4- 絶対配置。包含ブロックの内辺からの距離を指定して配置します。この値を指定した絶対配置のボックスは、通常の配置から独立しているため、ほかの要素の配置に影響を与えません。絶対配置のボックスにもマージンは存在しますが、他のマージンとの相殺は行われません。
fixed	C2- ie7- N6- 固定配置。表示領域(スクリーン上のウィンドウなど)の指定位置に固定配置するようにします。スクロールしても位置は変わりません。出力する対象によっては、ウィンドウではなくページなどに固定されることになります。