CSS DOM问题-找不到覆盖属性的原因

有问题的网站是1000freewebsites.com。我正在努力解决的具体页面有：

• 1000freewebsites.com/signup.php
• 1000freewebsites.com/login.php

该网站使用骨架框架和Ryan Fait的粘性页脚。在这些页面上，我有一个ID为#bluestripe的div，它应该填充页眉和页脚之间的垂直空间

有三个父元素#html、#body和.wrapper。全部设置为高度：100%；在样式表中#bluestripe还设置为高度：100%和最小高度：100%。据我所知，这应该达到我想要的效果。我的理论错了吗

使用Chrome Inspector，我发现.wrapper的height属性被划掉了。如果我的理论是正确的，这就解释了为什么#bluestripe没有扩展以填充垂直空间

我找不到任何超过包装器高度设置的元素。你能看到我遗漏了什么吗？

这是你的css：

.wrapper {
min-height: 100%;
height: auto !important; //height here
margin: 0 auto -40px;
height: 100% ;//height again here
}

您定义了两倍的高度，第一个定义的是

！重要信息

它将覆盖第二个

这会导致另一个错误，因为填充和其他元素正在向下推动

.container

div，因此，如果更改一些属性，可以消除此行为：

#bluestripe {
background: #0099cc;
width: 100%;
padding: 40px 0px 40px 0px;
border-top: 10px solid #666666;
/*height: 100%; drop this line*/
}

.wrapper {
background: #0099cc; /*add this line*/
min-height: 100%;
margin: 0 auto -40px;
height: auto; /*acording to ryanfaits's css this is what mades the footer stick to the botom*/
}

---

这将使

.bluestripe

再次收缩，但由于.wrapper仍具有相同的背景色，因此这无关紧要。

的CSS规则。wrapper

有两个高度声明。摆脱一个设置高度为自动

.wrapper {
    min-height: 100%;
    height: auto !important; /* <- Get rid of this one */
    margin: 0 auto -40px;
    height: 100%;
}

.wrapper{
最小高度：100%；
高度：auto！important；/*这样做会产生两个新问题：1）div现在延伸到视口下方，产生滚动效果2）粘性页脚中断。你可以在1000freewebsites.com/signup.php上看到这一点，现在已经很晚了，所以我要上床睡觉了。关于如何既保留粘性页脚，又有一个fu，有什么见解吗非常感谢ll height content div。感谢您的编辑：-），不幸的是，这不起作用，因为1）我在其他页面上有具有不同颜色背景的content div，并且每个页面上都有.wrapper。我考虑过专门为这些页面创建一个.wrapper类，但我使用了一个模板系统，这将开始出现错误t凌乱。2）bluestripe中的元素需要在页面上垂直对齐，因此我需要将此容器div设置为全高。我开始认为jquery粘性页脚可能是我唯一的解决方案，这让我很难过。看看我认为这就是你想要的效果？