Use grid for better spacing between elements.

2020-11-16 14:35:12 +01:00
parent c1c11f9782
commit 3b8d6f22ca
1 changed files with 3 additions and 7 deletions
--- a/src/components/AllWinesPage.vue
+++ b/src/components/AllWinesPage.vue
@@ -86,14 +86,10 @@ h1 {
 }

 #wines-container {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-evenly;
-  align-items: flex-start;
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  grid-gap: 2rem;

-  @include desktop {
-    margin: 0 2rem;
-  }

  > div {
    justify-content: flex-start;