WordPress admin menu display glitch in Google Chrome

Question

A recent update to Google Chrome seems to be causing issues with my WordPress admin menus.

This is happening on all sites, whether in local development or on t

Answer 1

A different variant of raffjones answer. Add this to your theme's functions.php file, and it will patch the issue. I have tested with success in Chrome 45 Mac:

// Patch for WP Admin rendering bug in Chrome 45+
function admin_menu_chrome_patch() {
    echo '<style>#adminmenu { transform: translateZ(0); }</style>';
}
add_action('admin_head', 'admin_menu_chrome_patch');

Answer 2

Edit: This issue has now been fixed in all versions of Chrome, on all platforms. Simply update your Chrome to the latest available version for your channel.

Old answer:

• Go to chrome://flags/#disable-slimming-paint
• Enable the "Disable slimming paint" option.
• Ensure that the "Enable slimming paint" option below it is not turned on.
• Relaunch Chrome.

Fixes it for me. Seems the bug is located in "Slimming Paint", part of the new Blink rendering.

Answer 3

Looks like this was just pushed to the Stable release of Chrome 45. I get exactly this messed up display in version 45 of Chrome on both Mac and PC.

Answer 4

Perhaps removing Chrome Beta will solve this issue? It did the trick for me :-)

Answer 5

try this for chrome-only

in functions.php:

/* fix glitch on chrome for admin menus */
function chromefix_inline_css() { 
    wp_add_inline_style('wp-admin', '@media screen and (-webkit-min-device-pixel-ratio:0) { #adminmenu { transform: translateZ(0); } }');
}
add_action('admin_enqueue_scripts', 'chromefix_inline_css');

Answer 6

This issue has very recently been fixed in Chrome 45.0.2454.93 so there should be no need to use this if you have the latest version of Chrome

The code below is only left in for reference.

---

You can fix this with CSS:

function chromefix_inline_css()
{ 
  wp_add_inline_style( 'wp-admin', '#adminmenu { transform: translateZ(0); }' );
}

add_action('admin_enqueue_scripts', 'chromefix_inline_css');

Add that to your theme functions.php file and it should fix the problem. There's no check for the Chrome browser specifically, but it appears this fix has no adverse effect on other browsers, so no harm done.

If you just want a plugin to do it: https://github.com/raffjones/chrome-admin-menu-fix