このWebページはDreamweaverではうまく見えますが、どのブラウザでも表示すると、3つの列はwrapper2 idにはありません。それも表示されません。なぜ私は理解できません。divが正しく配置されません。どうして?
これは、ここに私のHTMLコード
<body>
<div id="wrapper">
<div id="header">
<div id="menu"></div>
</div>
<div id="wrapper2">
<div id="leftpane"></div>
<div id="bodycontent"></div>
<div id="rightpane"></div>
</div>
<div id="footer"></div>
</div>
</body>
あるCSSが
#wrapper {
width: 900px;
background-color: #666;
margin-right: auto;
margin-left: auto;
}
#wrapper #header #menu {
background-color: #00F;
height: 50px;
width: 900px;
position: relative;
top: 150px;
}
#wrapper #header {
background-image: url(../images/index_03.gif);
height: 200px;
width: 900px;
}
#wrapper2 {
position:relative;
width:900px;
background-color:#999;
height:auto;
}
#leftpane {
width:200px;
height:347px;
background-color:#C96;
left:0px;
top:0px;
margin:5px;
float:left;
}
#rightpane {
width:200px;
height:347px;
background-color:#C96;
margin:5px;
float:right;
}
#bodycontent {
width:400px;
margin:5px;
height:347px;
background-color:#C96;
float:left;
}
#footer {
width:900px;
height:80px;
background-color:#0C6;
}
誰かがこの上で私を助けることができますでしょうか?
デモ@ http://jsfiddle.netを設定してください。 – PeeHaa
http://jsfiddle.net/mayRY/ - 私が何かを紛失していない限り、実際は大丈夫です。 –
@PeeHaa私は[それを追加しました](http://jsfiddle.net/E7yBJ/1/) - 問題は浮動要素では機能しない 'height:auto;'のように見えます。固定された高さにそれは上品に見えます。 –