Fixed Bottom Border on publicStaffBar sometimes causes 1px gap above sticky nav bar on Mobile Devices

[CmptrWz]

Affected version

2.2.6

When the staff bar (publicStaffBar property group) has a border-bottom with a width set to an odd number of pixels some devices misplace the sticky nav bar one pixel too far down. This results in a one-pixel gap that things can be seen through above the nav bar as you scroll.

On my Pixel 4 in Chrome, an even number of pixels on the border works fine. 2px, 10px, 100px all fine. But any odd number, be it the default 1px or a large 99px, leaves a single pixel gap.

Removing the border entirely removes the issue as well.

Figuring out what was going on here was very annoying because it only happens for staff, negating a bunch of "do you see..." checks with users.

 

[Chris D]

That’s been bugging me too and hadn’t had a chance to look into it yet, so thanks!

 

[XF Bug Bot]

Thank you for reporting this issue, it has now been resolved. We are aiming to include any changes that have been made in a future XF release (2.2.7).

Change log:

Workaround a browser quirk to do with sticky navigation and the staff bar when the border width is an odd number. This removes the bottom border entirely.

There may be a delay before changes are rolled out to the XenForo Community.