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
We also code custom websites or bespoke Lay features. Drop me a line at info@laytheme.com or check out my work at arminunruh.com.
Want to support my work? paypal.me/arminunruh
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