埋め込みdivの相対位置と絶対位置はどのように動作しますか？

Question

私はdivをdiv秒以内に配置する必要があり、私は狂っています。私はネット上で多くのドキュメントを読んだことがありますが、divが埋め込まれている場合、relativeとabsoluteの動作についてはまだ明確ではありません。以下で

誰かcame up：

私は絶対位置を把握するために見つけた最良の方法は、その ポジション：「下流」の子要素へと 位置相対ルックス：への絶対ルックス「上流」親要素。つまり、 HTML要素に絶対配置を指示すると、 は 相対：に設定されている要素が見つかるまで親要素を参照し、それに基づいて配置されます。 が見つからない場合は、デフォルトで に関して位置が決まります。

これはすべてのブラウザで正しいですか？これは完全な説明ですか？

私の問題は、いくつかdivにいくつかのdivが埋め込まれていることです。子供divを親の中に配置する必要があります。高精度（例えば、上の33、左の9）でdivを配置します。親divは、祖父母divに高精度で埋め込むことができます。

どのようにしてこの問題をすべてのブラウザで解決しますか？ divの階層全体をabsoluteと位置付けるスーパーrelative親divを作成する必要がありますか？現在の答えから

EDIT

、私は余分な疑問を持っている：1は、明示的に仕事を配置するために、各divにrelativeまたはabsolute位置を宣言しなければならないのですか？つまり、divにrelativeまたはabsoluteの位置がない場合は、位置を計算する際に考慮されません。 RECORDS

FOR

上記の質問への答えはイエスです。

Answer 1

は、私はそれが少し楽にこの方法を理解するために見つけますレイアウトフロー。したがって：

position: relative; 
top: 10px; 

は、それ以外の場合は通常のHTMLレイアウトよりも10px低いアイテムをプッシュします。

項目がposition:absoluteであれば、それは何の両親がその基準に満たしていない場合position: relativeまたはposition: absoluteまたはbody要素に相対的であるものは何でも最も近い親に対して配置されます。直接の親が `位置であれば、例えば：相対」と子供がいる：

position: absolute; 
top: 10px; 
left: 10px; 

その後、オブジェクトは親の左上隅から下に配置し、10pxの右になります。オブジェクトがposition: absoluteである場合、そのオブジェクトはページのレイアウトから削除され、他のオブジェクトのレイアウトには影響しません（独自の子を除く）。一例として、

、あなたがスライドショーでそれらを循環、あなたはこのCSSでそうするだろうことができますので、おそらく（コンテナオブジェクトに互いの上に3枚の画像を配置したい場合：

.container {position: relative; height: 100px; width: 133px;} 
.container img {position: absolute; top: 0; left: 0;} 

Answer 2

divの階層全体を絶対に配置するスーパー親の親divを作成する必要がありますか？

はい。各絶対配置要素は、それ自体が絶対的または相対的に配置された最も近い祖先内に配置されます。

Answer 3

私は絶対位置を把握するために見つけた最良の方法は、その 位置で再び

を次のブロックを繰り返すつもりです：子要素と 位置に対してルックス「下流」：絶対的なルックス "親要素に「上流」を割り当てる。つまり、 HTML要素に絶対配置を指示すると、 は 相対：に設定されている要素が見つかるまで親要素を参照し、それに基づいて配置されます。 が見つからない場合は、デフォルトで の位置になります。

はい、絶対的な親との相対的な位置を持つ必要があります。ボディーを指定します。後で、コードに関して、要素を親に対して絶対的に配置することができます。

すべての絶対位置は、異なる画面解像度になると一種の痛みです。

しかし、行く方法は、親の相対的な位置を持って、次に絶対的な子供を持つことです。アイテムは、その後、上、下、左、右のポジションのいずれかのスタイル設定は、アイテムが通常であったであろう場所に相対的なもので、position: relativeある場合

：