diff --git a/dashboards/cards/area.yaml.j2 b/dashboards/cards/area.yaml.j2
index cb9a8cd6..0a129d78 100644
--- a/dashboards/cards/area.yaml.j2
+++ b/dashboards/cards/area.yaml.j2
@@ -150,34 +150,35 @@
 
 type: picture-elements
 image: {{ image | default('/local/rooms/placeholder.webp') }}
-style: |
-  .element[class~=element] {
-    position: relative;
-    transform: none;
-  }
-  ::-webkit-scrollbar {
-    width: 3px;
-    height: 3px;
-  }
-  ::-webkit-scrollbar-track {
-    background: rgba(0, 0, 0, 0.55);
-  }
-  ::-webkit-scrollbar-thumb {
-    background: rgba({{ color }}, 0.55);
-  }
-  ::-webkit-scrollbar-thumb:hover {
-    background: rgba({{ color }}, 1);
-  }
+card_mod:
+  style: |
+    .element[class~=element] {
+      position: relative;
+      transform: none;
+    }
+    ::-webkit-scrollbar {
+      width: 3px;
+      height: 3px;
+    }
+    ::-webkit-scrollbar-track {
+      background: rgba(0, 0, 0, 0.55);
+    }
+    ::-webkit-scrollbar-thumb {
+      background: rgba({{ color }}, 0.55);
+    }
+    ::-webkit-scrollbar-thumb:hover {
+      background: rgba({{ color }}, 1);
+    }
 elements:
   - type: custom:container-element
     style:
       position: absolute
-      top: 0
-      right: 0
-      left: 0
-      bottom: 0
+      inset: 0
       display: flex
+      align-items: stretch
       flex-direction: column
+      flex-wrap: nowrap
+      justify-content: space-between
       "--secondary-text-color": "#DADADB"
       "--primary-text-color": "#DADADB"
       "--paper-item-icon-color": "#DADADB"