Title: incorrect menu classes Last modified: July 19, 2018 --- # incorrect menu classes * Resolved [fastfasterfastest](https://wordpress.org/support/users/fastfasterfastest/) * (@fastfasterfastest) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/) * The menu (css) classes are in some circumstances generated inconsistently/incorrectly. * Assume you have a menu item with a “Navigation Label” with a space, e.g. “Fast Faster”. * If you specify the theme option `Menu Settings/Mobile Menu Options/Submenu items collapse until opened` as `Off` then the menu item’s css class will be `menu- fast-faster` – notice how the space in the “Navigation Label” is replaced with a dash. (The menu item also get other css classes, e.g. `menu-item-14`.) * However, if you specify the theme option `Menu Settings/Mobile Menu Options/Submenu items collapse until opened` as `On` then the menu item’s css class will be ` menu-fastfaster` – notice how the space in the “Navigation Label” is removed rather than replaced with a dash. * This causes problems if you want to target the menu item using the menu class– the menu item in the mobile menu will be different than the menu item in the regular menu. * A likely cause is the class `kadence_mobile_walker` and its `start_lvl` method. It seemingly uses a different method to generate the css class from the “Navigation Label” than what `wp_nav_menu` uses. The `start_lvl` method uses `sanitize_key`, perhaps it should use `sanitize_title` instead, or some other method. Viewing 9 replies - 1 through 9 (of 9 total) * Thread Starter [fastfasterfastest](https://wordpress.org/support/users/fastfasterfastest/) * (@fastfasterfastest) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10507202) * Should have stated that this affects the mobile menu. * [hannah](https://wordpress.org/support/users/hannahritner/) * (@hannahritner) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10507424) * Hey, Can you post a link to your site? I’m having a hard time following… * Hannah * Thread Starter [fastfasterfastest](https://wordpress.org/support/users/fastfasterfastest/) * (@fastfasterfastest) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10509205) * Hi Hannah, Sorry cannot provide a link to a live site. Here is how you can easily replicate it: 1. create a menu 2. assign it to primary and mobile location 3. select a page and add it to the menu 4. edit the menu item added and change its “Navigation Label” to `Fast Faster` 5. click “Save Menu” 6. edit “Theme Options”, set “Menu Settings/Mobile Menu Options/Submenu items collapse until opened” to “On” 7. click “Save Changes” 8. edit “Theme Options”, add custom css `.menu-fast-faster::before { content: " NEW! "; }` 9. click “Save Changes” * Then, view the site. Size your browser so the regular menu is visible. Notice how the menu item says “NEW! Fast Faster”. Then, resize your browser so the mobile menu is visible. Notice how the menu item says “Fast Faster” (incorrect, should be “NEW! Fast Faster”.) * The regular menu’s item has a css class `menu-fast-faster`. The mobile menu’s item has a css class `menu-fastfaster` (incorrect, should be `menu-fast-faster`.) * [hannah](https://wordpress.org/support/users/hannahritner/) * (@hannahritner) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10509445) * Hmmm, I actually think this is intentional. Because the mobile menu is technically a different menu, the classes need to be different. The theme developer is backpacking at the moment, but when he returns I’ll have him confirm this. In the meantime try out this css: `.menu-fast-faster::before, li.menu-fastfaster::before { content:" NEW! "; }` * Hannah * Thread Starter [fastfasterfastest](https://wordpress.org/support/users/fastfasterfastest/) * (@fastfasterfastest) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10509490) * I don’t think it is intentional. The css classes don’t need to be different ( and imo should not be different) – if you want/need to target the item in only one of the menus you can use additional css selector(s) for its ancestor element. * If you set “Menu Settings/Mobile Menu Options/Submenu items collapse until opened” to “Off”, the menu item in the mobile menu the menu item gets the class `menu- fast-faster`, the same (correct) css class name as the item gets in the regular menu. Thus, a regular menu and a mobile menu with the “same” item with the same css class name. * Thanks – I know how to avoid and/or work around the issue. I just wanted to report the bug as a courtesy and thank-you for providing this free theme. * The theme calls `wp_nav_menu` in header.php, one of the calls causes `kadence_mobile_walker` to be called and I think the problem is in its `start_lvl` method as I mention in my original post. * [hannah](https://wordpress.org/support/users/hannahritner/) * (@hannahritner) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10509519) * Thank you for reporting! Again, I will inform the developer when he returns. * Cheers! * Hannah * Thread Starter [fastfasterfastest](https://wordpress.org/support/users/fastfasterfastest/) * (@fastfasterfastest) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10509685) * 👍 * [Ben Ritner – Kadence WP](https://wordpress.org/support/users/britner/) * (@britner) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10523715) * I’ve updated this and it’s going to be out with the next release. * Thread Starter [fastfasterfastest](https://wordpress.org/support/users/fastfasterfastest/) * (@fastfasterfastest) * [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10523719) * Thanks. - This reply was modified 7 years, 10 months ago by [fastfasterfastest](https://wordpress.org/support/users/fastfasterfastest/). Viewing 9 replies - 1 through 9 (of 9 total) The topic ‘incorrect menu classes’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/virtue/3.4.15/screenshot.png) * Virtue * [Support Threads](https://wordpress.org/support/theme/virtue/) * [Active Topics](https://wordpress.org/support/theme/virtue/active/) * [Unresolved Topics](https://wordpress.org/support/theme/virtue/unresolved/) * [Reviews](https://wordpress.org/support/theme/virtue/reviews/) * 9 replies * 3 participants * Last reply from: [fastfasterfastest](https://wordpress.org/support/users/fastfasterfastest/) * Last activity: [7 years, 10 months ago](https://wordpress.org/support/topic/incorrect-menu-classes/#post-10523719) * Status: resolved