粘性页脚高度问题

Question

根据我的需要，我发现了一些粘性页脚。但现在我面临一个问题。 当我提高分辨率大于我的正常分辨率时，代码工作正常。但是容器div和footer div之间有间距。在这里，我还附上了我得到的和我想要的东西。

因此，根据图像，我想将（A）和（B）粘在一起。所以整个部分都是单一的。 在这里我也添加了我的CSS代码。由于HTML和CSS代码繁重。我无法使用JSfiddle。 我使用Twitter Bootstrap框架。

    html {
        position: relative;
        min-height: 100%;
    }
    body {
        margin: 0 0 100px; /* bottom = footer height */
    }
    footer {
        background: none repeat scroll 0 0 #FFFFFF;
        border-left: 1px solid #E1E1E1;
        border-right: 1px solid #E1E1E1;
        border-bottom: 1px solid #E1E1E1;
        position: absolute;
        bottom: 0;
        height: 100px;
    }

    #wrap {
        min-height: 100%;
        height: auto !important;
        height: 100%;
        margin: 0 auto -142px;
    }

Answer 1

正如我在图片中看到的那样，有3个区块，一个黑盒子，然后是一个红色框，然后是黑盒子。

我可以建议你使用C＃和div。请尝试在此处获取概念并在您的情况下实施。

假设我有三个div就像你的情况一样。如果你使div成为一个接一个，那么你需要遵循“float：left”属性，这样如果任何div旁边没有空格，那么div将一个接一个地出现。这是因为div是块元素。

同样，只有将所有div放在一个容器/ div中，并且具有相同的“float：left”属性时才会起作用。

让我们回到你的问题。这里似乎是你一个接一个地拥有2个街区。但是当你放大红色容器时会出现很多空格。

我猜红色容器可能有一些高度，或者可能是继承父元素的高度。检查一次。如果不是则转到border属性，并将红色元素的边框设为0px。并在所有3个块中使用float：left属性，以便不会从其他块元素继承空间。如果你可以将3个块放在具有float：left属性的单个块中会更好。

希望这适用于你的情况。

由于

Answer 2

完成， 我是通过Jquery完成的。 这是一个Jquery代码

    $(document).ready(function(){
        $('.contentpartbg').css({height:$(window).height()});
    });