[Support request] Header with 3 columns

Home Forums Support [Support request] Header with 3 columns

Home Forums Support Header with 3 columns

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #1681734

    Hello, I would like to have a header with 3 columns where the logo is in the first column, the main menu is located in the second column and a search widget (Adv Woo Search) is located in the 3rd column.

    For tablets and mobiles these columns could be placed one below the other.

    I will appreciate your help.

    Customer Support

    Hi there,

    it may take a little CSS, but if you:

    1. Set your Navigation Location to Float Right. This will position it to the right of the logo.
    2. Add your Adv Search to the Header Widget. This will place that to the right of the menu

    Once all three elements are inline – share a link to the site and ill look at whats need to align them


    I send you the access data, the site is under maintenance. Thanks since now!

    Customer Support

    Hi Alberto,

    You are actually have 4 columns in the header including the site description, you could give this CSS a try, but I might not work work in smaller screens. I would recommend to add the site description into the logo image.

    @media (min-width: 769px) {
        .inside-header.grid-container.grid-parent {
            display: flex;
            flex-flow: row wrap;
        .inside-navigation {
            display: flex;
        .site-logo {
            order: 1;
            width: 30%;
        .header-widget {
            order: 3;
            width: 20%;
        p.site-description {
            order: 4;
            margin-top: -20px;
        nav#site-navigation {
            order: 2;
            width: 50%;
        div#primary-menu {
            margin-left: auto;
            margin-right: auto;
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.