Madde Persson Madde Persson - 1 year ago 190
CSS Question

bootstrap sticky footer but no scroll content

I want a stick to bottom footer, witch i have but my content scrolls when it fills the page to the content, i want my content to push the footer down instead of scrolling.
I use Bootstrap


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 -250px;
/* Pad bottom by footer height */
padding: 0 0 250px;

/* Set the fixed height of the footer here */
#footer {
height: 250px;

#footer {
background-color: #000000;
border-top:1px solid gray;
background-position:center bottom;


<!-- Wrap all page content here -->
<div id="wrap">

<!-- Begin page content -->
<div class="container">

<asp:ContentPlaceHolder ID="MainContent" runat="server">
<div id="push">

<footer id="footer" class="footer navbar-fixed-bottom">
<div class="container body-content">
<p style="margin-top:20px;">&copy; <%: DateTime.Now.Year %> - Make-Up Studio Sverige</p>

Answer Source

the solution is to delete the class="footer navbar-fixed-bottom" in the
<footer id="footer" class="footer navbar-fixed-bottom">

The answers i got work in js fiddle as long as you don't put in the bootstrap css.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download