diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js
index 4e1bda55..8c8b7289 100644
--- a/src/components/gallery/gallery.js
+++ b/src/components/gallery/gallery.js
@@ -89,9 +89,9 @@ const Gallery = {
     },
     rowStyle (row) {
       if (row.audio) {
-        return { 'padding-bottom': '25%' } // fixed reduced height for audio
+        return { 'aspect-ratio': '1/4' } // fixed reduced height for audio
       } else if (!row.minimal && !row.grid) {
-        return { 'padding-bottom': `${(100 / (row.items.length + 0.6))}%` }
+        return { 'aspect-ratio': `${(1 / (row.items.length + 0.6))}/1` }
       }
     },
     itemStyle (id, row) {
diff --git a/src/components/gallery/gallery.vue b/src/components/gallery/gallery.vue
index d5500334..8418ea84 100644
--- a/src/components/gallery/gallery.vue
+++ b/src/components/gallery/gallery.vue
@@ -96,7 +96,7 @@
 
   .gallery-row {
     position: relative;
-    height: 0;
+    max-height: 30em;
     width: 100%;
     flex-grow: 1;