Admin menu icon distorted in Chrome when #adminmenu folded

[nextendweb]

By default - when the admin menu is not folded - the icons in the admin menu are 36px wide.

#adminmenu div.wp-menu-image {
    float: left;
    width: 36px;
    height: 34px;
    margin: 0;
    text-align: center;
}

With this width, Chrome renders the icons sharp.

When the admin menu is folded it changes the width to 35px:

.folded #adminmenu div.wp-menu-image {
    width: 35px;
    height: 30px;
    position: absolute;
    z-index: 25;
}

The icons are blurry as the lines in the icon shifted 0.5px horizontally -> antialising.

Possible solution:
Do not force .wp-menu-image to 35px when the menu folded.

.folded #adminmenu div.wp-menu-image {
    height: 30px;
    position: absolute;
    z-index: 25;
}

[nextendweb]

Blurry icons

[nextendweb]

Not blurry

[faisal03]

Hi,

I have attached a patch. Please review.

Thanks

[nextendweb]

Seems OK. It would be good to know if the 35px was a fix for an older bug or not...

This removes the folded admin menu icon width override so the icons keep their default 36px width instead of being rendered on a half-pixel boundary.

Testing:

• npm run grunt -- precommit:css