Describe the bug
I've been living thinking that
gap (as well as
grid-gap) works perfectly fine with
flex elements. Today I learned it's not supported in Safari which means there's a missing whitespace in Safari which I have already confirmed testing few views.
That means we have to fix all instances of a combination of two utility classes
gap-* in our views (
.jsx) AND also all instances of similar situation but in our SCSS files...
gap does work with
grid but we should not simply replace every
flex instance with
grid because grid is for layout and flex is for components.
So in most cases we will have to remove
gap property and replace it with additional margin on child elements...
Test our site in Safari.
Desktop (please complete the following information):
Smartphone (please complete the following information):