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

[Support request] Header & Menu Alignment

Home Forums Support [Support request] Header & Menu Alignment

Home Forums Support Header & Menu Alignment

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #216844
    Rob

    I have a small problem with the Logo and Primary navigation menu alignment in the header.

    Logo and Menu are inline, I want to position the menu to the left with the logo but when I float menu left it swaps places with the logo. So the menu is now on the left but the logo is on the far right.

    Logo is set to float left, menu is set to Alignment Left but setting menu to float left is what causes the behaviour I don’t want.

    Is this a bug or possibly by design ?

    #216883
    Tom
    Lead Developer
    Lead Developer

    Hi Rob,

    This is by design.

    So you’re wanting the logo, then the navigation floating to the right, but directly next to the logo?

    #216899
    Rob

    Hi Tom,

    No I need them both floating left, with the menu beside the logo.

    I make alot of sites with say only 3 items in the menu, so it looks visually better to have them beside the logo instead of a huge white gap when you float the menu right.

    Make sense ? I might not be explaining this very well.

    #217052
    Tom
    Lead Developer
    Lead Developer

    You could try adding this PHP:

    add_action('after_setup_theme','generate_float_navigation_below');
    function generate_float_navigation_below()
    {
    	remove_action( 'generate_before_header_content', 'generate_add_navigation_float_right', 5 );
    	add_action( 'generate_after_header_content', 'generate_add_navigation_float_right', 5 );
    }

    Then this CSS:

    .nav-float-right .main-navigation,
    .site-logo {
        float: left;
        clear: none;
    }

    This assumes your logo is set to float right.

    Adding CSS: https://generatepress.com/knowledgebase/adding-css/
    Adding PHP: https://generatepress.com/knowledgebase/adding-php-functions/

    #217486
    Rob

    Hey Tom,

    Thanks for posting this, I’ll give it a try later today.

    One thing I did figure out though was why setting menu alignment to left doesn’t do anything when the menu is inline with the logo. It doesn’t have a width set.

    When I add a width to the menu (container size – logo width = max menu width) it then aligns the menu items to the left like I want them.

    #217564
    Tom
    Lead Developer
    Lead Developer

    Ah, glad you got that working.

    Let me know how the code does 🙂

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