Twenty Fourteen: Space above the fixed bar in FF

[DrewAPicture]

Seems like we're getting some extra space above the fixed bar when scrolling in Firefox. It doesn't do it when in the Customizer, and seems OK in Chrome, so this may be localized to this browser.

Screencast for your viewing displeasure: ​http://screencast.com/t/9ywPneKvD

[lancewillett]

Thanks, this was bugging me at WCSF Contributor Day, glad you've tracked it for us.

[obenland]

Have you tried it with MP6 activated?

[MikeHansenMe]

I noticed this as well. It does not happen with MP6 activated.

[MikeHansenMe]

screenshot of space using chrome

[MikeHansenMe]

Patch to remove the space

[MikeHansenMe]

This problem seems to affect more than just chrome. The patch I submitted fixes the problem for me on FF23 and Chromium28 on Ubuntu. This patch will need to be tested because the problem does not seem to affect all browser OS combos.

[obenland]

To explain the difference: In MP6 the toolbar is 4px taller than in pre-MP6 and Further was optimized for MP6.

[MikeHansenMe]

So it seems we need to wait this one out to see if MP6 makes it into core in 3.8. If not I think patching it would be a good idea so it will look right with default core toolbar.

[markoheijnen]

We can easily apply the patch and add this for now:
.admin-bar.mp6 #masthead.masthead-fixed { top:32px; }

[georgestephanis]

Honestly, as the plan is for them to ship together, I think we should just test them together. If MP6 drops (unlikely) then we can re-address it.

[nacin]

Replying to georgestephanis:

Honestly, as the plan is for them to ship together, I think we should just test them together. If MP6 drops (unlikely) then we can re-address it.

Replying to markoheijnen:

We can easily apply the patch and add this for now:
.admin-bar.mp6 #masthead.masthead-fixed { top:32px; }

I prefer the latter approach.

[georgestephanis]

That being said, we should account for the 12px gap between the 782px breakpoint where the MP6 header goes to 46px high ​http://plugins.trac.wordpress.org/browser/mp6/trunk/components/responsive/css/admin-bar.css#L15, and the 770px breakpoint where the nav stops being fixed ​http://core.trac.wordpress.org/browser/trunk/src/wp-content/themes/twentyfourteen/js/theme.js#L95

(even if that's just switching the Twenty Fourteen js breakpoint to match the mp6 one at 782px)

[obenland]

If we're backwards compatible with 3.6 (I assume we are) we'd have to accommodate for both toolbars, MP6 and non-MP6.

[lancewillett]

In 25063:

Twenty Fourteen: ensure toolbar doesn't have a gap at the top when you start scrolling, including back compat for 3.6. Props MikeHansenMe and SergeyBiryukov, fixes #24914.