As designed Search button becomes detached from nav at smaller font sizes

Warchamp7

Active member
Affected version
2.0.4
Here's a demo image on the default theme with font-size: 10px set on html

1529334429850.webp

Adding the User nav item to p-discovery fixes the issue, so it appears the user avatar is the element causing the nav to remain attached

1529334580110.webp
 
Here's a demo image on XenForo.com with font-size: 10px set on html

View attachment 178187

How did you setted up 10px font? When i did 80% page size, i see it good
wufzKj8.jpg
 
How did you setted up 10px font? When i did 80% page size, i see it good
wufzKj8.jpg

Using Chrome's inspector tool to create the example here. On my website I have the default font size set to 14px, which causes a 1px gap between search and the nav. I did 10px as an extreme example

Changing page zoom won't cause this, since it'll scale everything on the page down, not just the font size
 
With the way the elements here are laid out, significantly the avatar, if the font-size is reduced, you'll also need to shrink the avatar size too. It's that which is adding the extra height to the account section which isn't also added to the search section.

These values should work at 14px font-size:
Less:
.p-navgroup-link.p-navgroup-link--user .avatar
{
    width: 19px;
    height: 19px;
}
 
Top Bottom