Slidebars with Sticky Footer

itzikmi commented 8 years ago

Hi,

I have implemented Slidebars and it works great! Problem is that my sticky footer is no longer sticky... I used this method for sticky footer:

<body>
<div class="wrapper">
  ...site content
  <div class="push"></div>
</div>  <!-- /wrapper -->
  ...footer
</body>

Once I implemented Slidebars I tried this:

<body>
<div id="sb-site">
  <div class="wrapper">
    ...site content
    <div class="push"></div>
  </div>  <!-- /wrapper -->
    ...footer
</div>  <!-- /sb-site -->
  ...Slidebars
</body>

But it didn't work, i.e. the footer is no longer sticky...

I also tried this:

<body>
<div class="wrapper">
  <div id="sb-site">
    ...site content
  </div>  <!-- /sb-site -->
    ...Slidebars
  <div class="push"></div>
</div>  <!-- /wrapper -->
  ...footer
</body>

But no luck...

This is the sticky footer CSS:

html, body {
    height: 100%;
}
.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -150px;
}
.footer, .push {
    height: 150px;
}

Please advise.

Thank you, Isaac

DanielGarzaB commented 8 years ago

I have a similar problem with my sticky header

https://github.com/adchsm/Slidebars/issues/196

amichel86 commented 8 years ago

I have the same problem with a fixed element in my page. Any solutions? :(

ghost commented 8 years ago

+1

vtxmg commented 7 years ago

+1

amichel86 commented 7 years ago

If i'm not mistaken you have to put your footer div outside of the #sb-site container and assign a "sb-push" class to it so when you open the slidebars, the fixed element gets pushed also.

adchsm / Slidebars

Slidebars with Sticky Footer #205