Custom navigation in foreground?
-
Hi there,
I have a question concerning my navigation.
http://patriciaklein.de/humor-und-sprache/I made one by myself by adding a text element on every project page and fixed the position with custom css:
.Navigation {
position: fixed;
}Now I want the navigation to be in the foreground while scrolling. I read about the z-index, but that didn't work. Any ideas how to solve it?
and another question:
Is it possible to set a random frontpage by every refresh, for example from one defined category?Many thanks!
Patricia -
Hey you need to set the row which contains your nav to position fixed.
Right click the first row and click "set html class and id".Add a html class to the row like "fixed-nav", and use this CSS:
.fixed-nav{ position:fixed; z-index: 10; }
also
body.slug-humor-und-sprache{ padding-top: 120px; }
To have space at the top!
If you are curious as to why your attempt didn't work, it has to do with z-index stacking context.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_contextYour element is not in the same stacking context as the other elements because all my .row divs that contain the elements are position relative
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it