Skip to content

Examples demonstrating different behaviour of CSS grids across Chrome, Safari and Firefox

Notifications You must be signed in to change notification settings

fadedglamour/css-grid-weirdness

Repository files navigation

Firefox and Safari seem rather confused about the height of the contents of grid elements.

This nicely coloured grid looks great until you try and fill it with stuff.

Happy

This is fine in Chrome, but odd in Safari and Firefox (in the same way)

Chrome 57

Chrome 57 grid looking OK

Safari 10.1

Safari 10.1 grid looking weird

Firefox 53.0

FF 53.0 grid looking similarly weird

This is even weirder - it does what you might expect in Chrome, fixes Safari assuming it's behaving differently, and ends up particularly weird in FF.

Chrome 57

Chrome 57 grid looking sort of OK

Safari 10.1

Safari 10.1 grid looking maybe ok

Firefox 53.0 FF 53.0 grid looking extra weird

¯\_(ツ)_/¯

About

Examples demonstrating different behaviour of CSS grids across Chrome, Safari and Firefox

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Languages