Issue: Non-Clickable Area in Admin Profile Dropdown

[r0nak]

When hovering over the far-right section of the admin profile dropdown in WordPress, a portion of the area is not clickable. This issue affects user interaction, as clicking on certain parts of the dropdown does not register any action.

Steps to Reproduce:
Log in to the WordPress dashboard.
Hover over the top-right "Howdy, Admin" section to reveal the dropdown.
Move the cursor towards the far-right side of the dropdown.
Attempt to click within the red-marked area (as shown in the attached screenshot).

Expected Behavior:
The entire dropdown area should be clickable without any unresponsive sections.

Actual Behavior:
A portion of the dropdown on the far-right is unclickable, causing usability issues.

Additional Notes:
This issue might be due to improper CSS handling, possibly an unintended margin or padding.
A potential fix could involve checking the CSS rules for .ab-sub-wrapper or inspecting any overflow properties affecting the dropdown.

[mukesh27]

Nice catch @r0nak

I also reproduce that issue in WP admin. It needs to CSS adjustment to fix the issue mark as good-first-bug so new contributor can work on it.

Move it to 6.8 for visibility.

Additional props to @pooja-n @jbanas @rinkalpagdar

[audrasjb]

I'm not sure I understand the issue :)
The left margin (on the left of the gravatar) is also not clickable, and both sounds relevant to me.
Pinging @karmatosed for a second opinion.

Fixes #62991

Removes the right margin from the admin profile dropdown to make area clickable.

[sabernhardt]

if the right margin is removed, a long display name would still have some padding on the link (shown with avatar, on large screen)

[sabernhardt]

without the avatar, a long display name is so wide in the top level that the list item has plenty of space on the right even without the right margin

[sabernhardt]

on smaller screens, with avatars enabled, the link hides the avatar and has 16px padding on left and right without any margin

[sabernhardt]

when avatars are not enabled, removing the right margin would leave the left margin on smaller screens, plus 16px padding on both sides

[sabernhardt]

The list item margins were added in r18776 and r19276. Then r26134 set the margins to 0 on smaller screens when the avatar is enabled.

If this removes the right margin, the profile link still would not be clickable for the full width, but I think an unclickable area on the left is fine. I tested with a very long display name, and I am not concerned about how it can look a little imbalanced in that situation. The link has padding of 10 pixels (or 16 on smaller screens), so the text should not touch the edge. Besides, keeping the display name shorter would help to avoid crowding the top-level links.

---

Note: I would not recommend trying to make the link cover the full width (in Core). Screenshot_28 shows that the Log Out link can appear slightly above the bottom of the avatar image when the display name matches the username. Even the space immediately below the text is unclickable in that case.

[audrasjb]

As per today's bug scrub: It appears this ticket still needs some work/discussion. As 6.8 beta 1 is very close, I'm moving it to 6.9. Feel free to move it back to 6.8 if it can be committed by Monday.