100％高度的CSS，固定页脚

我的代码是在http://jsfiddle.net/ATbA5/2/代码可视也将在这个帖子100％高度的CSS，固定页脚

我试图使内容包装100％的高度。然而它为中心结束。我看过其他的stackoverflow上的theards并找不到解决方案。此外，在该页面的结束不是broswer窗口底部的固定页脚

HTML

<head> 
<link rel="stylesheet" type="text/css" href="primary-resources/css/main-styles.css"/> 
</head> 
<body> 
<div class="content-wrapper"> 
<!-- Header --> 
<div class="header"> 
<div class="threetwentyleft"> 
<a href="index.html"><img src="primary-resources/imgs/header-logo.png" /></a> 
</div> 
<div class="sixfortyright"> 
<div class="gameAdBanner"> 
<img src="game-resources/gameone/imgs/banner.png"/> 
</div> 
</div> 
</div> 
<!-- Content --> 
<div class="gameLeft"></div> 
<div class="gameRight"></div> 
</div> 
</body> 
</html>

CSS

body ,html { 
    background-color:#000000; 
    height:100%; 
    top:0px; 
    bottom:0px; 
    clear:both; 
    padding:0px; 
    margin:0px; 
} 
.content-wrapper { 
    margin:auto; 
    background-color:#ffffff; 
    width:960px; 
    padding:0px; 
    bottom:0;px; 
    top:0px; 
    margin:auto; 
    box-sizing:border-box; 
    height:100%; 
    box-sizing:border-box; 
    clear:both; 
    box-sizing:border-box; 

} 
.header { 
    width:100%; 
} 
.threetwentyleft { 
    width:320px; 
    float:left; 
    padding:2px; 
} 
.threetwentyleft img{ 
    width:320px; 
    padding:2px; 
    border:0px; 
} 
.sixfortyright { 
    width:630px; 
    float:right; 
    height:130px; 
} 
.gameAdBanner { 
    width:610px; 
    margin-top:2px; 
    margin-left:auto; 
    margin-right:auto; 
} 
.center { 
    margin-left:auto; 
    margin-right:auto; 
} 
.gameLeft { 
    width:700px; 
    padding:5px; 
    float:left; 
} 
.gameRight { 
    width:260px; 
    background-color:#CCC; 
    float:right; 
    padding:5px; 
    height:100%; 
    margin-right:3px; 
} 
.footer { 
    width:960px; 
    background-color:#FC6; 
    bottom:0px; 
    height:25px; 
    position:absolute; 
}

来源

2013-06-18 shaq

“你在页面的最后”你的意思是在右侧？ – caramba

@caramba在问题 – shaq

之后，标记为HTML和CSS的代码在您的html中没有页脚（并且在css中没有class =“center”的元素） – caramba

听起来像是你想正常的HTML行为，不需要任何的CSS ，只需在内容后添加一个div或任何块元素即可。

来源

2013-06-18 14:13:08

100％高度的CSS，固定页脚

回答

相关问题