Skip to:

[Resolved] admin bar mobile css

  • shayne


    When viewing my site on a mobile device, or shrinking the browser window, the admin bar hides the notifications bubble and custom menus I have added.

    Where would I find the css that is affecting the display of the admin bar when viewed with low screen resolutions?

Viewing 3 replies - 1 through 3 (of 3 total)

  • shayne





    If you want help, you must give details: about what you did and how, theme name,…

    That said, the Toolbar belongs to WordPress.

    Some ideas here:

    Remove WordPress Admin Bar CSS

    Quick Tip: Override WordPress Toolbar Styles

    BuddyPress use only a few and very minimalistic CSS. See at the end of /bp-templates/bp-legacy/css/buddypress.css for some styles applying to smartphones.



    I figured it out. For some reason WordPress decided it would be a good idea to hide custom menus added to the toolbar(when did they change the name from admin bar?) when viewing it on mobile devices.

    If you browse through the WordPress directory you will find the css for the toolbar in wp-includes\css\admin-bar.css.

    This line hides everything but the default items from the toolbar.

    	/* Show only default top level items */
    	#wp-toolbar > ul > li {
        		display: none;

    By changing “display: none” to “display: block”. That fixed the problem i was having.

    So hopefully that information is useful to someone.

    Oh and one more thing. If you need to modify the toolbars css don’t do it there. You shouldn’t modify WordPress’s core files. Instead you should copy that css to your themes style sheet.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘[Resolved] admin bar mobile css’ is closed to new replies.
Skip to toolbar