The admin menu toolbar misaligns sub items vertically, especially when the parent item is 2 lines, especially in a browser with a bigger font size.

2 pictures should explain.

Before fix:

before

After fix:

after

The problem is the weird, arbitrary -22px margin.

The fix is very easy:

html #admin-menu .dropdown li li {
  position: relative;
}
html #admin-menu .dropdown li li.expandable ul {
  margin: 0; /* undo the top -22px and left 160px */
  position: absolute;
  left: 160px !important; /* fixed width from admin menu, important because JS makes it 'auto' */
  top: 0;
}

That's what I added in a custom CSS to override admin menu's CSS.

I might make a patch later.

Comments

rudiedirkx’s picture

Title: Wrong submenu items offset » Wrong submenu items vertical position/offset
rudiedirkx’s picture

Version: 7.x-3.0-rc4 » 7.x-3.x-dev
Status: Active » Needs review
FileSize
1.02 KB
PASSED: [[SimpleTest]]: [MySQL] 228 pass(es). View
54.34 KB
62.51 KB

So simple. After patch:

Not toolbar:

admin menu, no toolbar

Toolbar:

admin menu, toolbar

frank.schalkwijk’s picture

I changed your patch a little to make it work with the adminimal theme.

Status: Needs review » Needs work

The last submitted patch, 3: wrong_submenu_items-2398413-3.patch, failed testing.

Tessa Bakker’s picture

Status: Needs work » Needs review
FileSize
1.03 KB

New patch, same code only not corrupted.

Also tested the patch with RTL and LTR and 'Adminimal Admin Menu', works nice on Chrome and Firefox!