使用bootstrap使用页脚粘贴+响应

Question

这是我的HTML，我无法从容器中分隔页脚 这是 html ：

<div class="container-fluid fill-height">
    <div class="view-slide-in ng-scope">    
        <form id="signup-form" name="frm">
            <input type="text">
                <button>HI</button>
        </form>
        <div id="footer" class="navbar navbar-default navbar-fixed-bottom ng-scope">
        <div class="container col-md-offset-2">
        sss
        </div>
    </div>  
</div>

jsfiddle
我该怎么做这个粘性？

更新：

正常

调整大小

Answer 1

您可以使用绝对位置和底部位置：0。

#footer{
    position:absolute;
    bottom:0;
}

这里是jsfiddle：http://jsfiddle.net/6b0wkb5z/1/

Answer 2

为什么你不能使用它..

<div id="footer" class="container">
    <nav class="navbar navbar-default navbar-fixed-bottom">
        <div class="navbar-inner navbar-content-center">

            <p class="text-muted credit">here is the footer</p>
        </div>
    </nav>
</div>

这是FIDDLE

Answer 3

如果您想要在页面主内容太大的情况下将页脚从底部推出（而不是像固定或绝对位置那样坐在内容上），您可以使用以下样式：

body, html, .container-fluid {
    height:100%;
    padding:0;
    margin:0;
}
.view-slide-in {
    display:table;
    width:100%;
    height:100%;
}
.view-slide-in > form {
    display:table-row;
    height:100%;
}
#footer {
    display:table-row;
    background:red;
}

Example

Content pushing footer down