Menu: Vertically center icons. Fix menu item wiggle and clearing in IE8

Fixes #9995
Closes gh-1235

diff --git a/themes/base/menu.css b/themes/base/menu.css
index f4588b13b9a6adf21c5f9cb7bd3a0cc46da777a0..2be35870fb76020e1f316d71332aa9c14a05b867 100644 (file)
--- a/themes/base/menu.css
+++ b/themes/base/menu.css
@@ -19,9 +19,9 @@
        position: absolute;
 }
 .ui-menu .ui-menu-item {
+       position: relative;
        margin: 0;
-       display: block;
-       padding: 3px .4em;
+       padding: 3px 1em 3px .4em;
        cursor: pointer;
        min-height: 0; /* support: IE7 */
        /* support: IE10, see #8844 */
@@ -44,20 +44,20 @@
        position: relative;
 }
 .ui-menu-icons .ui-menu-item {
-       position: relative;
        padding-left: 2em;
 }
 
 /* left-aligned */
 .ui-menu .ui-icon {
        position: absolute;
-       top: .2em;
+       top: 0;
+       bottom: 0;
        left: .2em;
+       margin: auto 0;
 }
 
 /* right-aligned */
 .ui-menu .ui-menu-icon {
-       position: relative;
-       top: -.2em;
-       float: right;
+       left: auto;
+       right: 0;
 }