html - 相対子と同じ高さの絶対配置 div

Question

本文の背景としてグラデーションを使用した Web サイトがあります。.main div は絶対配置されます。中のコンテンツと同じ高さにしたいのですが、どうすれば実現できますか?

Answer 1

メイン/コンテナ/ラッパーのdivを絶対に配置しないでください。相対的に配置してもらいます。

 <div class = "main">

    <div class = "content">....</div>

 </div>

次に、CSS を作成します。

.main {
  position: relative;
  margin: 0 auto;
}

.content {
  height: 100%;
}

この jFiddle を見てください: http://jsfiddle.net/persianturtle/3eJGr/

絶対配置が実際に何をするかについての素晴らしい記事は、ここにあります

セグメント:

絶対配置された要素は、ドキュメント フローから完全に削除されます。つまり、親要素や、ソース コードでそれらの後に出現する要素にはまったく影響しません。したがって、絶対配置要素は、それを防ぐための措置を講じない限り、他のコンテンツと重なってしまいます。

Answer 2

絶対配置された div 内の要素が相対的に配置され、幅と高さがある場合、この css を.maindivに適用できます。

height:auto;

これは、内部のすべてのコンテンツの高さに応じて高さを計算します