我的网站现在看起来很棒。除了在 iPhone 上，当直立时，我的内容和页脚之间有一个很大的丑陋空白。我希望页脚始终位于内容下方，但同时在任何地方都保持正确的外观。如何使页脚自动延伸到该内容并具有与页脚相同的颜色以填充页面的其余部分？
这是我的代码：
/********************
Page Base
********************/
html, body {
height: 100%;
width: 100%;
overflow-x: hidden;
margin:0;
padding:0;
font-family: Tahoma, Geneva, sans-serif;
font-size: 12px;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
}
img, a {
border:none;
outline: none;
}
#wrapper{
min-height:100%;
max-height:950px;
position:relative;
}
#header {
width: 100%;
height:145px;
background-color: #fff;
position: relative;
}
#shadow {
width: 1920px;
height:145px;
background-image:url(images/h_shadow.png);
position: relative;
z-index:-1;
margin-top:-98px;
}
#content {
height:auto;
position:relative;
padding:770px;
padding-bottom:35px;
width:100%;
display:none;
z-index:-2;
}
.contentbox{
width:3000px;
height:100%;
margin-top:-770px;
padding:0;
right:0;
left:0;
background:fff;
position:absolute;
z-index:-1;
margin-left:2000px;
}
#footer {
width:100%;
height:72px;
position:absolute;
bottom:0;
left:0;
background:#222;
margin:0;
padding:0;
}
.clear {
clear:both;
}