Black Friday Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Resolved] Positionaing Widget on Header

Home Forums Support Positionaing Widget on Header

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #490983
    elsa

    Hi,
    Currently I use this to split header into 3 parts and inserting 2 widgets of navigation menu in the right header. How to do positioning of the widgets? I want to make the appearance in the right header:
    Level 1: menu 1011
    Level 2: menu 1010

    <blockquote><div class="grid-33 header-left">
       
    </div>
    
    <div class="grid-33 header-center">
        
    </div>
    
    <div class="grid-33 header-right">
         [widget id="nav_menu-1011"]
         [widget id="nav_menu-1010"]    
    </div></blockquote>

    Thanks

    GeneratePress 2.0.2
    GP Premium 1.5.6
    #491022
    Tom
    Lead Developer
    Lead Developer

    You could give this CSS a shot:

    .site-header .widget_nav_menu li {
        display: inline-block;
    }

    You’ll want to remove the floats from the surrounding elements though.

    #491026
    elsa

    Hi Tom,
    Thanks so much, it’s working! I used as mentioned,

    .site-header .widget_nav_menu li {
    display: inline-block;
    }


    @media
    (min-width: 769px) {
    .site-header .widget_nav_menu {
    position: absolute;
    right: 0;
    }
    }

    But I still need to make the widget separated, menu 1011 above menu 1010. How to do that?

    #491533
    Tom
    Lead Developer
    Lead Developer

    Separate them horizontally?

    Try this:

    .site-header .widget_nav_menu {
        margin-bottom: 10px;
    }
    #491754
    elsa

    ok cool

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.