fix: add flex properties to grid GH-25

Lemonpeach · Apr 11, 2020 · 034686e · 034686e
1 parent 47a8f0e
commit 034686e
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/packages/panda-san/src/layout/grid.scss b/packages/panda-san/src/layout/grid.scss
@@ -1,14 +1,17 @@
 .grid {
   display: flex;
+  flex-wrap: wrap;
   width: 100%;
 }
 
 .column {
+  flex-grow: 1;
+  flex-shrink: 1;
   padding: px-to-rem($grid-column-gap / 2);
 
   @for $column-size from 1 through 12 {
     &--is-#{$column-size} {
-      width: calc(100% / 12 * #{$column-size});
+      flex: none;
     }
 
     &--is-offset-#{$column-size} {
@@ -20,7 +23,7 @@
     @for $column-size from 1 through 12 {
       @include breakpoint($breakpoint-name) {
         &--is-#{$column-size}-#{$breakpoint-name} {
-          width: calc(100% / 12 * #{$column-size});
+          flex: none;
         }
 
         &--is-offset-#{$column-size}-#{$breakpoint-name} {