NEED HELP ABOUT MAIN NAVIGATION MENU

  • Unknown's avatar
    pboateng2 · Member ·

    NEED HELP ABOUT MAIN NAVIGATION MENU
    Hello.

    I need to increase the width of the Peter Mason main navigation menu. Currently, it is wrapping one of my sections to a second row and it doesn’t look so great.

    This is the link to the website “www.spaliqueur.com”.

    If anyone can give me a CSS code to add to my child theme to make all my menu on one line. I would if like it if the menu lines up under the logo and the logo shifted to the middle.

    Thank you.

  • Unknown's avatar
    mrsnlchauhan · Member ·

    Hi @pboateng2,
    Your site is not hosted on WordPress.com. It is hosted on Dreamhost. You can check this at link below:
    https://www.whoishostingthis.com/#search=www.spaliqueur.com

    This support forum is strictly for sites hosted on WordPress.com.

    You might want to post your question on WordPress.org support forum:

    https://wordpress.org/support/forums/

    Regards
    Sunil Chauhan

  • Unknown's avatar
    pboateng2 · Member ·

    Hi @mrsnlchauhan

    Please I have posted the question in wordpress .org.

    If you can help, can you check the site and help me with the CSS?

    Thanks.

  • Unknown's avatar
    mrsnlchauhan · Member ·

    Hi @pboateng2,

    If anyone can give me a CSS code to add to my child theme to make all my menu on one line. I would if like it if the menu lines up under the logo and the logo shifted to the middle.

    Add the following CSS code and you will get what you are looking for:

    @media (min-width: 768px)
.vc_col-sm-3 {
    width: 100%;
}

@media (min-width: 768px)
.vc_col-sm-9 {
    width: 100%;
}

    Hope this helps

    Best
    Sunil Chauhan

  • Unknown's avatar
    pboateng2 · Member ·

    Hi @mrsnlchauhan

    Thank you for your support. Please I put in the code but it did not work.

    I am putting all the code for the header and menu here and see if you can figure it out for me.

    /* Main menu */
    .sc_layouts_menu {
    position: relative;
    z-index: 3;
    }

    .sc_layouts_menu_nav > li {
    // z-index: 0 !important;
    }
    .sc_layouts_menu .sc_layouts_menu_nav > li ul {
    width: 20em;
    padding: 2.78em 0;
    }
    .sc_layouts_menu .sc_layouts_menu_nav > li > ul {
    top: 4.8em;
    }
    .sc_layouts_row_fixed_on .sc_layouts_menu_nav > li > ul {
    top: 3.8em;
    }

    .sc_layouts_menu .sc_layouts_menu_nav > li > ul ul{
    left: 20em;
    }
    .sc_layouts_menu .sc_layouts_menu_nav > li > ul ul.submenu_left {
    left: -20em;
    }
    .sc_layouts_menu .sc_layouts_menu_nav > li li > a {
    padding: 0.6em 3.7em;
    }
    .sc_layouts_menu .sc_layouts_menu_nav > li > a,
    .sc_layouts_menu .sc_layouts_menu_nav > li.menu-item-has-children > a {
    padding: 0.4em 4.4em;
    }
    .sc_layouts_menu .sc_layouts_menu_nav > li.menu-item-has-children > a:after {
    display: none;
    }

    .sc_layouts_menu .sc_layouts_menu_nav > li + li:before {
    content: ‘|’;
    display: block;
    position: absolute;
    left: -1px;
    top: 50%;
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    transform:translateY(-50%);
    }

    .sc_layouts_menu .sc_layouts_menu_nav li li.menu-item-has-children > a:after{
    right: 2em;
    }

    .top_panel_default .sc_layouts_menu_nav > li.menu-item-has-children > a:after {
    display: none;
    content: ‘e828’;
    font-family: ‘fontello’;
    }
    .top_panel_default .sc_layouts_menu_nav li li.menu-item-has-children > a:after {
    content: ‘e836’;
    font-family: ‘fontello’;
    }

    .sc_layouts_title_caption {
    font-size: 3.214rem;
    font-weight: 400;
    letter-spacing: 0.038em;
    }

    .sc_layouts_title_title + .sc_layouts_title_breadcrumbs {
    margin-top: 1.1em;
    }

    .breadcrumbs {
    font-size: 0.786rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    }
    .breadcrumbs .breadcrumbs_delimiter {
    margin: 0 0.85em;
    }
    .breadcrumbs .breadcrumbs_delimiter:before {
    content: ‘|’;
    }

    Thank you

  • Unknown's avatar
    pboateng2 · Member ·

    Hi @mrsnlchauhan

    Thank you. It was padding issue and I fixed it.

  • The topic ‘NEED HELP ABOUT MAIN NAVIGATION MENU’ is closed to new replies.