diff --git a/stylesheets/singularitygs/_css-grid.scss b/stylesheets/singularitygs/_css-grid.scss index 8e42fec..ed2038a 100644 --- a/stylesheets/singularitygs/_css-grid.scss +++ b/stylesheets/singularitygs/_css-grid.scss @@ -102,40 +102,42 @@ @mixin css-grid-span($Span, $Location: false) { $grid: find-grid(); - @if type-of($grid) == 'number' or length($grid) == 1 { - // If we have a symmetric grid _and_ no location, Float Span makes most sense - @if $Location == false { - @include float-span($Span, $Location); - } - // If we have an symmetric grid _and_ a location, Isolation Span makes most sense - @else { - @include isolation-span($Span, $Location); - } - } - @else if type-of($grid) == 'list' or length($grid) > 1 { - $calc: false; - @each $column in $grid { - @if not unitless($column) { - $calc: true; + @supports not(display: grid) { + @if type-of($grid) == 'number' or length($grid) == 1 { + // If we have a symmetric grid _and_ no location, Float Span makes most sense + @if $Location == false { + @include float-span($Span, $Location); + } + // If we have an symmetric grid _and_ a location, Isolation Span makes most sense + @else { + @include isolation-span($Span, $Location); } } + @else if type-of($grid) == 'list' or length($grid) > 1 { + $calc: false; + @each $column in $grid { + @if not unitless($column) { + $calc: true; + } + } - // If we have an asymmetric grid _and_ it includes united numbers, needs to be Calc - @if ($calc) { - @include calc-span($Span, $Location); - } - // If we have an asymmetric grid _and_ it doesn't include united numbers, Islotion's better - @else { - @include isolation-span($Span, $Location); + // If we have an asymmetric grid _and_ it includes united numbers, needs to be Calc + @if ($calc) { + @include calc-span($Span, $Location); + } + // If we have an asymmetric grid _and_ it doesn't include united numbers, Islotion's better + @else { + @include isolation-span($Span, $Location); + } } } @supports (display: grid) { @if $Location { - grid-columns: $Location / span $Span; + grid-column: $Location / span $Span; } @else { - grid-columns: span $Span; + grid-column: span $Span; } } } \ No newline at end of file