У меня есть nghtmare с некоторым кодом на сайте, который я делаю, должно быть довольно просто, но это не так.
Я хочу, чтобы мой нижний колонтитул придерживался нижней части страницы, но чтобы весь контент был на первом месте (когда стоит больше, чем страница, если это имеет смысл)
Я смог сделать это в Safari, Chrom и Firefox, но главная проблема заключается в неожиданном сюрпризе, Internet Explorer.
Я нахожусь в точке, где она находится внизу, однако нижний колонтитул появляется над содержимым страницы, когда есть много (см. Вкладку «Кто мы»).
http://www.break -comms.com / index.html
Я был бы очень признателен за любую помощь в этом, так как это действительно начинает раздражать меня, возвращаясь назад к изменяющему форт коду в течение добрых нескольких часов.
Ниже приведен CSS, который сопровождает страницу, как я уже говорил, любая помощь по этому вопросу будет ДЕЙСТВИТЕЛЬНО оценена.
* {
border:0px;
margin:0px;
padding:0px;
}
#html {
height:100%;
}
#banner {
padding: 5px 0px 10px 0px;
}
#container {
width:970px;
margin:0 auto;
height: 100%;
position: relative;
}
#wrapper {
position: relative;
min-height: 100%;
}
#nav {
margin-left:0px;
text-indent:0px;
text-align:center;
}
#menutab li {
display:inline;
list-style-type:none;
font-family:Arial;
font-size:18px;
font-weight:100;
text-align:center;
}
#menutab a {
color:#9ea3ab;
padding:5px 32px 5px 32px;
text-decoration:none;
text-align:center;
}
#menutab b {
color:#9ea3ab;
padding:5px 0px 5px 0px;
text-decoration:none;
text-align:center;
}
#menutab a:hover {
color:#28957f;
}
#social .socialImage{float:right;
}
.divFloat {
float:right;
padding:0px 5px 0pc 0px;
}
.clear {
clear:both;
}
#social {
background:transparent;
}
#footer {
Position:fixed;
bottom:0;
width:970px;
height:45px;
background-image:url(images/footer.gif); width:970px; height:45px;
}
#footermenu .footermenu{float:right;
}
#footermenu li {
display:inline;
font-family:Arial;
list-style-type:none;
font-size:16pt;
}
#footermenu a {
color:#9ea3ab;
font-family:Arial;
padding:0px 5px 0px 0px;
text-decoration:none;
text-align:right;
}
#footermenu a:hover {
color:#28957f;
}
.clearfooter {
height:45px;
clear:both;
}
#address {
color:#28957f;
font-family:Arial;
font-size:16px;
text-indent:5px;
}
#address2 {
color:#9ea3ab;
font-family:Arial;
font-size:14px;
text-indent:5px;
}
#contentbackground {
background-image:url("images/homebackgroundimage.gif"); width:970px; height:400px;
}
#contentbackgroundcontact {
background-image:url("images/contactbackgroundimage.gif"); width:970px; height:330px;
}
#contentbackgroundyouth {
background-image:url("images/youthbackgroundimage.gif"); width:970px; height:350px;
}
#contectbackgroundwhoweare {
background-image:url("images/whowearebackgroundimage.gif"); width:970px; height:700px;
}
#contentbackgroundmusic {
background-image:url("images/musicbackgroundimage.gif"); width:970px; height:360px;
}
#contentbackgroundbrand {
background-image:url("images/brandbackgroundimage.gif"); width:970px; height:500px;
}
#content {
color:#9ea3ab;
font-family:Arial;
font-size:14px;
padding:5px 30px 5px 50px;
text-decoration:none;
text-align:top;
}
#content2 {
color:#9ea3ab;
font-family:Arial;
font-size:14px;
padding:5px 30px 5px 70px;
text-decoration:none;
text-align:top;
}
#contentcontact {
color:#9ea3ab;
font-family:Arial;
font-size:16px;
padding:5px 30px 5px 50px;
text-decoration:none;
text-align:top;
}
h1 {
color:#9ea3ab;
font-family:Arial;
font-size:16px;
padding:5px 30px 5px 35px;
text-decoration:none;
text-align:top;
}
body {
height: 100%;
background-image:url("images/denimbackground.gif"); repeat;
}