This topic contains 5 replies, has 2 voices, and was last updated by  Skandha 1 month, 1 week ago.

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

    npangers
    Participant

    Hi!

    I was hoping if there was a plug-in or through CSS to get my logo and menu bar to be on the same line as to having the menu bar below the logo.

    #181829

    Skandha
    Keymaster

    @npangers: Hello there,
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    #header-content, #header-navigation-area {
        display: inline-block;
    }

    Let me know if this works out!
    Kind Regards,
    Skandha

    #181872

    npangers
    Participant

    Hi @skandha

    It only works on larger screens when I right click to inspect, but it goes onto the next line in smaller screens. I need both logo and menu on the same line, even when the menu collapses.

    #181888

    Skandha
    Keymaster

    @npangers: Hello there,
    Replace the above code by the following.
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    @media screen and (min-width: 1024px) {	
    	#header-content,#header-navigation-area {
    	     display: inline-block;
    	}
    }

    The menu will overflow to the next line as the screen size decreases as you have a lot of menu items that would not fit beside the logo.

    Let me know if the menu looks better now.
    Kind Regards,
    Skandha

    #181897

    npangers
    Participant

    Hi @skandha

    No change with the new code.

    #181921

    Skandha
    Keymaster

    @npangers: Hello there,
    With the latest code I provided you the menu looks better on screens below 1024px.

    It is not possible to have the menu aligned next to the logo when the screen size decreases as the menu does not fit alongside the logo. So, it overflow below.

    Kind Regards,
    Skandha

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.