我要寻找使我的页脚粘建议。
我试图实现此使用此产品的例子: 实施例
当一个页面的内容是小于屏幕高度footbar是好的和棍棒底部,但在含量较大和垂直滑块发生页脚显示的内容的底部,而不是留粘在屏幕的底部。
在这里,我_layout
HTML
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
/* Top navbar code */
</div>
<div id="wrap">
<div class="container body-content">
@RenderBody()
<hr />
</div>
</div>
<div id="footer">
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
</body>
CSS
body {
/*padding-top: 60px;
padding-bottom: 20px;*/
}
/* Set padding to keep content from hitting the edges */
.body-content {
padding-left: 15px;
padding-right: 15px;
}
/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
max-width: 280px;
}
/* styles for validation helpers */
.field-validation-error {
color: #b94a48;
}
.field-validation-valid {
display: none;
}
input.input-validation-error {
border: 1px solid #b94a48;
}
input[type="checkbox"].input-validation-error {
border: 0 none;
}
.validation-summary-errors {
color: #b94a48;
}
.validation-summary-valid {
display: none;
}
html,
body {
height: 100%;
/* The html and body elements cannot have any padding or margin. */
}
/* Wrapper for page content to push down footer */
#wrap {
min-height: 100%;
height: auto;
/* Negative indent footer by its height */
margin: 0 auto -60px;
/* Pad bottom by footer height */
padding: 0 0 60px;
}
/* Set the fixed height of the footer here */
#footer {
height: 60px;
background-color: #f5f5f5;
}