Okay
  Public Ticket #1075462
Responsive menu breakpoint
Closed

Comments

  •  1
    neilforrester started the conversation
    February 25, 2017 at 11:42am

    Hello,

    My client has a few menu items and some of those are wrapping onto the next line between viewpoints 1000px and 1215px wide which doesn't look good. 

    I would like the main menu to become the responsive burger menu at breakpoint 1215px instead of 1000px. How can I do this please?

    Many thanks,
    Neil.

  •  8,999
    Tahir replied
    February 25, 2017 at 3:10pm

    Hey Neil,

    I am afraid we dont have a Update Proof Fix Available . Also looking at your logo and the menu size id suggest you use the Centered Header Layout : http://themenectar.com/docs/salient/theme-options/header-navigation/#layout-related . 

    Be.st 

    ThemeNectar Support Team 

  •  1
    neilforrester replied
    February 26, 2017 at 3:03am

    Hi Tahir,

    I changed the header nav to Centered Menu Alt which works better and created a media query in the custom CCS code to adjust the padding and font-size. It's working better now.

     /* Medium Devices, Desktops */
        @media only screen and (max-width : 1215px) {
        #header-outer[data-format="centered-menu-under-logo"] header#top .span_9 nav > ul > li:not(#social-in-menu):not(#search-btn):not(.slide-out-widget-area-toggle) > a {
        font-size: 12px !important;
        padding-bottom: 20px !important;
        padding-left: 3px;
        padding-right: 3px;
        padding-top: 0 !important;
    }
        }

    Plus, I have to say Salient really is a brilliant theme. Making website design easier and enjoyable again! Thank you!

    Regards,
    Neil.



  •  8,999
    Tahir replied
    February 27, 2017 at 5:46pm

    Hey Again,

    Sorry for the Weekend Delay.

    Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :

    @media only screen and (max-width: 1000px) and (min-width: 1px) {
    .single-portfolio #full_width_portfolio .row .col.section-title h1, .single-portfolio .row .col.section-title h1 {
        line-height: 1.5em !important;
    }
}

    Thanks

    ThemeNectar Support Team