0
編集： これでcurrentyちょっと代わりに問題に苦しんで、私は新しいものを作り始め、解決しました。コンテンツボックスは、テキストやその他の項目の多くがある場合、コンテナのdivの外に浮かぶ
問題がありました。これは、サイトのコンテンツディビジョン（たとえば、100％の高さのiframe）にコンテンツを追加すると、コンテンツdivが展開されてConatiner divから浮いてしまうことになります。 だから、CSSコードは、エラーに関連しないコンテンツずに、この..
@charset "utf-8";
/* CSS Document */
body{background-image:url('/media/Background.png');}
#Container{
position:relative;
width: 900px;
min-height:200px;
margin: 0px auto 0 auto;
text-align: left;
padding-left: 1px;
cursor: de;
border-left: 1px solid #000001;
border-right: 1px solid #000001;
border-top: 1px solid #000001;
background-color:#C1E9FF;
overflow:inherit;
}
#LogoContainer{
position:absolute;
background-image:url('/media/Logo.png');
border-right-width:1px;
border-bottom-width:1px;
border-right-color:rgb(0,0,1);
border-bottom-color:rgb(0,0,1);
border-right-style:solid;
border-bottom-style:solid;
width:400px;
height:50px;
}
#LikeBar{
position:absolute;
border-bottom-width:1px;
border-bottom-color:rgb(0,0,1);
border-bottom-style:solid;
width:500px;
height:50px;
left:400px;
}
#ButtonHome{
position:absolute;
background-image:url('/media/Bt.png');
width:100px;
height:30px;
top:50px;
z-index:1;
}
#ButtonVideo{
position:absolute;
background-image:url('/media/Bt.png');
width:100px;
height:30px;
left:105;
top:50px;
z-index:1;
}
#ButtonSpeedtest{
position:absolute;
background-image:url('/media/Bt.png');
width:100px;
height:30px;
left:210;
top:50px;
z-index:1;
}
#ButtonYVideos{
position:absolute;
background-image:url('/media/Bt.png');
width:100px;
height:30px;
left:315;
top:50px;
z-index:1;
}
#YouTubeBox{
position:absolute;
background-image:url('/media/Box.png');
width:100px;
height:30;
left:10px;
text-align:center;
}
#TwitterBox{
position:absolute;
background-image:url('/media/Box.png');
width:100px;
height:30;
left:110px;
text-align:center;
}
#FaceBookBox{
position:absolute;
background-image:url('/media/Box.png');
width:100px;
height:30;
left:210px;
text-align:center;
}
#Content{
position:relative;
top:90px;
width:780px;
min-height:80%;
border-top:1px solid #000001;
}
#Footer{
position:relative;
border-top-width:1px;
border-top-color:rgb(0,0,1);
border-bottom: 1px solid #000001;
border-top-style:solid;
width:900px;
bottom:0px;
z-index:1;
text-align:center;
}
#AdFooter{
position:relative;
width:728px;
height:100px;
margin: 0px auto 0 auto;
border-left: 1px solid #000001;
border-right: 1px solid #000001;
}
#AdSidebar{
position:absolute;
width:120px;
height:600px;
left:780px;
top:50px;
border-left: 1px solid #000001;
border-bottom: 1px solid #000001;
}
p{line-height: 1px;}
そして、現在のHTMLコードです。
<html>
<head>
<title>Faulty css</title>
<link href="ThemeV1.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="Container"> <!-- Start Container -->
<div id="LogoContainer">
</div>
<div id="LikeBar">
<p class="DivT">
</p>
</div>
<!-- Menu Controls -->
<a href="/"><div id="ButtonHome"><center><p>Home</p></center></div></a>
<!-- <a href="/blog"><div id="ButtonVideo"><center><p>Blog</p></center></div></a> -->
<a href="/Speedtest.html"><div id="ButtonSpeedtest"><center><p>SpeedTest</p></center></div></a>
<a href="/videos.html"><div id="ButtonVideo"><center><p>Videos</p></center></div></a>
<!-- WEBSITE CONTENT -->
<div id="Content">
<iframe src="about:blank" width="100%" height="100%" allowTransparency="true"></iframe>
</div>
<!-- END WEBSITE CONTENT -->
<!-- Footer -->
<div id="Footer">
<p>Test</p>
<th>
</div>
<!-- End Footer -->
<div id="AdFooter">
</div>
<div id="AdSidebar">
</div>
</div> <!-- End Container -->
</body>
</html>
これが原因とされている理由のための私の推測では、フッタがロックされ、内容が大きくなっている時に動かないということです。 そして、私はしたくは行わないことは、すべてが、これは私が作成した最初のテーマだったが、それは動作しますが、フッター上のバグを引き起こし再コード化することです。
は、私はそれを試してみましたが、フッタは、まだコンテンツの原因をオーバーレイされているので、フッターが高さを変更せず、Pは決してフッタの外に強制的になかったです。 – Teknikk
実際にCSSの固定フッタソリューションの1つを試してください。 –