Pack gallery photos with CSS columns

2026-09-26 18:56:43 +01:00
parent 8515274a12
commit c864e781d7
1 changed files with 8 additions and 6 deletions
@@ -227,14 +227,16 @@ hr {
 }

 .art .post-list {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: $spacing-unit;
-  align-items: start;
+  column-count: 2;
+  column-gap: $spacing-unit;

  > li {
-    min-width: 0;
+    display: inline-block;
+    width: 100%;
    margin-top: 0;
+    margin-bottom: $spacing-unit;
+    break-inside: avoid;
+    -webkit-column-break-inside: avoid;
  }

  .post-content > p:last-child {
@@ -251,7 +253,7 @@ hr {
  }

  @include media-query($on-palm) {
-    grid-template-columns: 1fr;
+    column-count: 1;
  }
 }