olefredrik / FoundationPress

FoundationPress is a WordPress starter theme based on Foundation 6 by Zurb
https://foundationpress.olefredrik.com
MIT License
2.71k stars 871 forks source link

Sticky sidebar covering footer #1150

Open danitorresalb opened 6 years ago

danitorresalb commented 6 years ago

How can this bug be reproduced?

  1. Make a wordpress sidebar widget with sticky class (https://foundation.zurb.com/sites/docs/sticky.html).
  2. Go to any page on the site where is displayed a footer too.
  3. Change the size of the window to a small viewport (but not the smallest).
  4. Scroll down

What did you expect to happen? I expected that the widget with sticky class did the same that when you scroll down with the big screen view (disallowing his stikyness before the footer section).

What happened instead? The widget is placed in front of the footer, covering its content.

Please List the Following:

Sorry about my english...

Thanks!

FlatspinZA commented 6 years ago

Hi

I have had problems like this before. Try targeting the z-index of your footer to bring it to the top.

danitorresalb commented 6 years ago

Thanks for the answer FlatspinZA.

But, do you think it's the optimal solution? I though that there will be a best option. And what level of z-index would be the appropiate?

FlatspinZA commented 6 years ago

I am not a professional...

But, I have had issues with sticky things, sliders, etc. going over menus, etc, and have always fixed it with a z-index.

I have no idea what the optimal z-index would be, or even if these such a thing as "optimal" in these cases. For me it's been a case of bringing elements that must always be visible to the front of everything, and from what I understand determining your z-index has to do with amount of layers you have, so using the absolute highest to always display your footer shouldn't be a problem.

There are a whole range of z-index discussions here: https://foundation.zurb.com/forum/tags/z-index