Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    Custom navigation in foreground?

    General Discussion
    2
    3
    290
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • P
      patricia last edited by patricia

      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

      1 Reply Last reply Reply Quote 0
      • arminunruh
        arminunruh Global Moderator last edited by

        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_context

        Your element is not in the same stacking context as the other elements because all my .row divs that contain the elements are position relative

        1 Reply Last reply Reply Quote 0
        • P
          patricia last edited by

          Thanks a lot for your answer!
          Didn't think of adding a html class to the row … ;-)

          1 Reply Last reply Reply Quote 1
          • First post
            Last post

          Before you post

          Use the Search Feature. Maybe there is already a solution to your issue.

          1. Update Lay Theme and all Lay Theme Addons
          2. Disable all Plugins
          3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
          4. Now see if your problem solved itself
          5. Go here, see if your problem is listed here:
          Troubleshooting

          When you post:
          1. Post a link to where the problem is
          2. If the problem is difficult to explain, post screenshots / link to a video to explain it

          Thanks!

          Online Users

          H
          S
          S

          Recent Topics

          • S

            New fade-in / opacity bug?

          • A

            Unable to update lay theme / to login wp admin

          • A

            New button feature not available

          • S

            Theme crashed - because of Polylang?

          laytheme.com