Black Friday Sale! Get up to $30 off GP Premium! Learn more ➝

[Resolved] Secondary menu fixed in header

Home Forums Support [Resolved] Secondary menu fixed in header

Home Forums Support Secondary menu fixed in header

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #237347
    Walt

    I feel like I’m missing something. I’d like my secondary menu to be fixed in the upper right hand corner of my header, and to stay fixed there until both menus switch to the mobile menu. I have GP Premium. How do I do that? Thanks!

    #237418
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    I’m not too sure what you mean – do you have any examples?

    The primary menu has the ability to be sticky, but the secondary menu doesn’t for now.

    #237440
    Walt

    Hi, Tom.

    Here’s the site: http://development.mrvac.org

    What’s happening is that when the window is resized, the primary and secondary menus move around. I would like to keep them anchored in one place – so that they are always on the right side next to the title/tagline. I don’t need them to be sticky, just sitting nicely in the top right-hand corner.

    Screenshot: http://development.mrvac.org/screen-shot-2016-10-20-at-3-15-11-pm/

    In the screenshot, the menus are positioned so that they are the same height as the site title and headline. I’d like them to stay that way until the window is resized to the point where the menu hits the title/tagline and then becomes the hamburger menu. Does that make sense?

    ETA: Or if nothing else, keep the secondary menu pinned to the upper right-hand corner so that it doesn’t move with resizing until it becomes the hamburger menu. Or until I figure out how to do mobile menus πŸ˜‰

    #237447
    Tom
    Lead Developer
    Lead Developer

    Ah I see.

    I don’t know why the secondary navigation stops floating at 1024px, wish I remember what I was thinking there. I’ve removed that in the next version.

    You can do this now:

    .nav-float-right .inside-header .site-branding {
        float: left;
    }
    
    @media (max-width: 1024px) {
        .secondary-nav-float-right .secondary-navigation {
            float: right;
            margin-bottom: 0;
            margin-top: 0;
        }
    }
    #237676
    Walt

    There we go – works like a charm. Thanks, Tom!

    #237714
    Tom
    Lead Developer
    Lead Developer
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.