0
固定サイドバーとフッター付きの水平スクロールウェブサイトがあります。私はフッタに座るために私のコンテンツを100％の高さにしようとしています。私のサイドバーは100％の高さになっていますが、内容はほとんどありませんが、内容のdivを100％にしてフッタに座らせることはできません。ここに私のHTML構造は次のとおりです。水平スライディングウェブサイトでコンテンツdivを100％にする問題
<html class="multiplebgs" xmlns="http://www.w3.org/1999/xhtml">
<body>
<div class="wrapper">
<div class="sidebar">
<div class="hlogo">Lorem Ipsum</div>
<div class="navigation demi f11">
<ul>
<li><a href="#content1">ABOUT US</a></li>
<li><a href="#content2">WHAT WE DO</a></li>
<li><a href="#content3">OUR THEORY</a></li>
<li><a href="#content4">PORTFOLIO</a></li>
<li><a href="#content5">CLIENTS</a></li>
<li><a href="#content6">CONTACT US</a></li>
</ul>
</div>
</div>
<section class="habout step">
<div class="content" id="content1">
</div>
</section>
</div>
<div class="footer fcolor">
</div>
</body>
</html>
そして、私のCSS：
html {
background: url(../img/bg.png) no-repeat fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/bg.png', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/bg.png', sizingMethod='scale')";
height:100%;
}
body {
margin:0;
height: 100%;
font-family:Verdana,Tahoma,Arial,Sans-Serif;
color:black;
font-size:12px;
width: 12660px;
}
.wrapper{
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -45px;
}
.content{
float:left;
width:1000px;
margin: 0px;
height: 100%;
padding: 0 360px;
}
#content1 { background:url(../img/bgaboutus.png) no-repeat bottom center;}
.sidebar {
float:left;
width:350px;
position: fixed;
background: url(../img/bg.png) no-repeat fixed;
-webkit-background-size: cover;
background-size:cover;
height: 100%;
z-index: 1;
}
.step {
float: left;
margin: 0px;
position:relative;
height: 100%;
min-width: 1000px;
padding: 0px;
overflow:auto;
}
.no-multiplebgs .habout {}
.multiplebgs .habout {background: url(../img/naboutus.png) top right no-repeat fixed;}
私は100％の高さは、セクションおよびコンテンツdivのあるサイドバークラスのCSSを適用する場合であっても文句を言わない、100％の高さまで伸ばします。
ご提案は大歓迎です。 ありがとう