Make top nav & logo sticky on mobile

  • Unknown's avatar
    greystonelandscapelawn · Member ·

    My top navigation menu/logo area is currently only sticky on a tablet in landscape view. I’d like it to be sticky on a tablet in portrait view as well as both landscape and portrait on mobile. Is there a css code that can accomplish this? Thank you!

    The blog I need help with is: (visible only to logged in users)

  • kokkieh · Staff ·

    Hi there,

    On mobile your theme uses a collapsed menu, which in terms of code is a completely different menu than the sticky menu it uses on wider screens. That’s controlled within your theme’s source code, and not something we can override with a quick CSS fix.

    Please contact support for your theme directly to ask if they have any way to override this. Based on the theme page at https://wordpress.org/themes/otography/ you can find their support at https://themespiral.com/forums/

    Unrelated, but I notice you keep posting in the forums for help. Your Business Plan gives you access to 24/7 live chat support via the help icon that appears bottom-right in My Sites, or via the form at https://wordpress.com/help/contact, where you’ll get helped much faster and where, unlike the forums, you’re guaranteed to get a staff reply.

  • kokkieh · Staff ·

    If you mean you just want the bar containing the logo, title and menu button to be sticky, you can try this:

    @media only screen and (max-width: 767px) {
  .main-header > .navigation-top {
    position: fixed;
    z-index: 9;
    background-color: white;
  }
}
  • Unknown's avatar
    greystonelandscapelawn · Member ·

    Thank you so much for letting me know that because I have a Business Plan, I can live chat for support! For some odd reason, that slipped my memory from when I first signed up – so thank you!

    And that css code you provided *was* what I was looking to achieve and worked like a charm. Thanks again!

  • The topic ‘Make top nav & logo sticky on mobile’ is closed to new replies.