If I'm using css grid for my layouts, how would I go about solving the IE and older ios not supporting it? Would I need a separate css file for those browsers?
I've tried using this, but the modern browsers are still using float and width % instead of using the grid layout
Code
.gallery > * {
float: left;
width: 25%;
}
@supports (display:grid) {
.gallery {
display: grid;
grid-template-columns: 1fr 1fr;
margin-top: 2rem;
@media screen and (min-width: $largephone-bp) {
grid-template-columns: 1fr 1fr;
}
@media screen and (min-width: $tablet-bp) {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
}
}
I tried using @supports not (display:grid)
But that's not supported on IE either..
This post was edited by Strickland on Dec 26 2019 06:43pm