scratch-www/src/components/masonrygrid/masonrygrid.scss
2018-12-10 18:06:07 -05:00

38 lines
525 B
SCSS

@import "../../frameless";
.masonry {
column-gap: $gutter;
column-width: $cols4;
padding-bottom: 1rem;
-webkit-perspective: 1;
}
// column-count required for Firefox, IE and Edge
//4 columns
@media #{$small} {
.masonry {
column-count: 1;
}
}
//6 columns
@media #{$medium} {
.masonry {
column-count: 1;
}
}
//8 columns
@media #{$intermediate} {
.masonry {
column-count: 2;
}
}
// 12 columns
@media #{$big} {
.masonry {
column-count: 3;
}
}