div B の高さに基づいて div A をストレッチするか、div A の高さに基づいて div B をストレッチすることに問題があります (コンテンツが最も多いものによって異なります)。
偽の列を調べてみましたが、divが同じ「ホルダー」にないため、これは機能しません...現在のコードは次のようになります。
<div id="header">
<div id="content">CONTENT HEADER</div>
</div>
<div id="content">
<div id="column-left">
<p>INHOUD LINKER KOLOM</p>
<p> </p>
</div>
<div id="column-right">
<p>INHOUD RECHTER KOLOM</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
<div class="clear"></div>
</div>
<div id="main">
<div id="content">
<div id="main-content">
<p>HOOFD INHOUD </p>
<p> </p>
<p> </p>
<p> </p>
</div>
</div>
<div class="clear"></div>
</div>
<div id="footer">
<div id="content">CONTENT FOOTER</div>
</div>
CSS として以下を使用します。
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
.clear {
clear: both;
}
#content {
position: relative;
width: 950px;
margin-left: auto;
margin-right: auto;
z-index: 10
}
#header {
position: relative;
min-width: 990px;
width: 100%;
height: 90px;
background-color: #F00;
}
#column-left {
width: 500px;
float: left;
background-color: #0F0;
}
#column-right {
width: 450px;
float: right;
background-color: #00F;
position: absolute;
margin-left: 500px;
}
#main {
min-width: 990px;
width: 100%;
background-color: #FF0;
}
#main-content {
width: 500px;
float: left;
}
#footer {
min-width: 990px;
width: 100%;
height: 90px;
background-color: #F00;
}
私の例では、「青」の div のコンテンツを長くしたのに対し、「黄色」の div を引き延ばしたいことがわかります (したがって、フッターは両方の下になります)。
逆の方法も適用できます（「黄色」のdivにさらにコンテンツが含まれる場合、「青」のdivが伸びる必要があります...背景として「黄青」の画像を指定すると、これは偽の列で解決できますが「青」divに）。画像としての例: http://tinypic.com/view.php?pic=jjpx0k&s=6
誰かがこれで私を助けることができますか?
どんな助けでも大歓迎です！