Skip to content

Instantly share code, notes, and snippets.

@claudia-romano

claudia-romano/layout_04_gridAuto-mixin-fallback.scss

Created July 20, 2018 10:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save claudia-romano/8eb124ff71b1a1f4027b8d6f479493f8 to your computer and use it in GitHub Desktop.
Save claudia-romano/8eb124ff71b1a1f4027b8d6f479493f8 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
layout_04_gridAuto-mixin-fallback.scss
@mixin gridAuto($min-width, $fallback: 3) {
> * {
float: left;
width: calc(100%/#{$fallback} - #{$gap-horizontal});
&:nth-child(#{$fallback}n + 1) {
clear: both;
}
}
@supports(grid-area: auto) {
grid-template-columns: repeat(auto-fit, minmax($min-width, 1fr));
> * {
width: auto;
margin: 0;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment