Title: responsive nav menu behavior broken? Last modified: August 22, 2016 --- # responsive nav menu behavior broken? * Resolved [sdwarwick](https://wordpress.org/support/users/sdwarwick/) * (@sdwarwick) * [11 years, 3 months ago](https://wordpress.org/support/topic/responsive-nav-menu-behavior-broken/) * innovationscommercialization.com * chrome/IE/android tested * 1) set width to < 900px 2) click on hamburger (condensed menu): can open/close dropdown menus as expected 2) scroll up causing title to move to left and reduce in size. 3) click on hamburger: causes a scroll-down action 4) click on hamburger again: no response, no menu dropdown. 5) scroll up no longer causes title to move left and reduce in size * not a child theme * some custom css: * .site-title { color: black; } * h2.site-description { color: black !important; } * a:focus, a:hover { color: #20589D; } * .nav li { background-color: rgb(244, 244, 248); border-radius: 5px; margin: 2px; } * div>ul.nav>.menu-item:first-child>a { padding-left: 20px !important} * div>ul.nav>.menu-item:last-child>a { padding-right: 20px !important } Viewing 5 replies - 1 through 5 (of 5 total) * [Rocco Aliberti](https://wordpress.org/support/users/d4z_c0nf/) * (@d4z_c0nf) * [11 years, 3 months ago](https://wordpress.org/support/topic/responsive-nav-menu-behavior-broken/#post-5855219) * Hi [@sdwarwick](https://wordpress.org/support/users/sdwarwick/) looking at your page you have chose to not display the menu on scrolling. Appearance -> Customize- > Header -> Design and layout -> STICKY HEADER SETTINGS Sticky header : display the menu * so the real “bug” is that with that option unchecked in responsive mode that button shouldn’t be displayed at all 🙂 * Hope this helps. * Thread Starter [sdwarwick](https://wordpress.org/support/users/sdwarwick/) * (@sdwarwick) * [11 years, 3 months ago](https://wordpress.org/support/topic/responsive-nav-menu-behavior-broken/#post-5855228) * Thanks for your response. I am still confused as to how this function should work. * It would seem that under all circumstances when you have scrolled back up and a menu is available, it should function. As it is now, after any scrolling activity the menu never gets reactivated * The only way to get the menu working again is to reload the page, which is not intuitive to users. * Not sure how to even debug this, it would be buried deep in the code * [Rocco Aliberti](https://wordpress.org/support/users/d4z_c0nf/) * (@d4z_c0nf) * [11 years, 3 months ago](https://wordpress.org/support/topic/responsive-nav-menu-behavior-broken/#post-5855230) * Ok, so I’ve been not clear 😀 * Go here: Appearance -> Customize -> Header -> Design and layout -> STICKY HEADER SETTINGS you can see you have this option `Sticky header : display the menu` unchecked, so you don’t display the menu when sticky header enabled, this means that the button shouldn’t be displayed at all. That’s the point. That option makes the menu match a css rule which hides it, and this basically breaks the dropdown. So that is the bug, when you have that option unchecked the menu button shouldn’t be displayed at all, so your issue is a lateral effect of another issue 😀 To hide the menu-button on scroll in mobiles, add this css rule: * ``` @media (max-width: 979px){ .sticky-enabled .tc-menu-off .btn-navbar { display: none; } } ``` * Otherwise, you want to keep the menu button in mobiles and show the menu even if you have that option checked? Then use this, instead: * ``` @media (max-width: 979px){ .sticky-enabled .nav-collapse.collapse.in{display: block} } ``` * Hope this helps. * Thread Starter [sdwarwick](https://wordpress.org/support/users/sdwarwick/) * (@sdwarwick) * [11 years, 3 months ago](https://wordpress.org/support/topic/responsive-nav-menu-behavior-broken/#post-5855234) * Thank you so much for this response. I would not have been able to find this solution without many hours of digging, if at all. If no one has said this recently, your help is so very much appreciated! * I have chosen the second solution, as having the collapsed but active nav is very useful and does not interfere with how the top bar looks. * Is this a bug that ends up as a fix in the next version? if so, how do you handle these two optional behaviors? * [Rocco Aliberti](https://wordpress.org/support/users/d4z_c0nf/) * (@d4z_c0nf) * [11 years, 3 months ago](https://wordpress.org/support/topic/responsive-nav-menu-behavior-broken/#post-5855235) * Thanks for your words sdwarwick! 😀 Well good questions 😀 I proposed a github pull-request to nikeo (the theme creator) regarding the first solution, ‘because is more consistent, but yes the second solution makes sense too. I mean one, when sticky header enabled and scrolling, could want the menu button in mobiles even if he doesn’t want the menu in non-mobiles. I don’t know if it will end up in a new option, as you can see there are already a lot of options in Customizr( users might be confused). Probably one of the two will be chosen as the default one and the other will be covered by a snippet on [http://themesandco.com/code-snippets](http://themesandco.com/code-snippets). But these are just my thoughts 😀 Viewing 5 replies - 1 through 5 (of 5 total) The topic ‘responsive nav menu behavior broken?’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/customizr/4.4.24/screenshot.png) * Customizr * [Support Threads](https://wordpress.org/support/theme/customizr/) * [Active Topics](https://wordpress.org/support/theme/customizr/active/) * [Unresolved Topics](https://wordpress.org/support/theme/customizr/unresolved/) * [Reviews](https://wordpress.org/support/theme/customizr/reviews/) ## Tags * [nav menu](https://wordpress.org/support/topic-tag/nav-menu/) * 5 replies * 2 participants * Last reply from: [Rocco Aliberti](https://wordpress.org/support/users/d4z_c0nf/) * Last activity: [11 years, 3 months ago](https://wordpress.org/support/topic/responsive-nav-menu-behavior-broken/#post-5855235) * Status: resolved