mozilla / bedrock

Making mozilla.org awesome, one pebble at a time
https://www.mozilla.org
Mozilla Public License 2.0
1.18k stars 919 forks source link

Refresh: main nav doesn't have space between items in some older browsers #15499

Closed craigcook closed 22 hours ago

craigcook commented 1 week ago

Description

While testing fallback states for variable fonts in older browsers (#15397) I noticed some weren't adding space between menu items in the main nav. I didn't dig into debugging it but my first guess would be maybe we're using some newer flex property that wasn't yet supported. Just wanted to note it and grab a few screenshots so we can circle back to it at some point.

Chrome 59 on Windows 8: image

Safari 13.1 on macOS Catalina: image

alexgibson commented 1 day ago

Looks like it's gap: 48px that's not supported on older browsers, even if they support flexbox. Switching out for some good old fashioned padding should work just as well.