diff --git a/client/src/styles/_default-layout.scss b/client/src/styles/_default-layout.scss
index 414a208a..8817be06 100644
--- a/client/src/styles/_default-layout.scss
+++ b/client/src/styles/_default-layout.scss
@@ -15,7 +15,7 @@
   @supports (display: grid) {
     display: grid;
   }
-  grid-template-rows: auto 1fr auto;
+  grid-template-rows: auto 1fr max-content;
   grid-template-areas: "h" "c" "f";
   min-height: 100vh;
   grid-auto-rows: 1fr;
@@ -57,7 +57,11 @@
 
   &__footer {
     grid-area: f;
+    // we usually set the margin to the bottom and the right, but here we want the footer to always have
+    // this margin, and we don't want to set it on every content element. And we don't want to set it on
+    // the content element, for if there's no footer.
     margin-top: 3*$large-spacing;
+    margin-bottom: -3*$large-spacing;
 
     padding: 0 $small-spacing;
 
diff --git a/client/src/styles/_room.scss b/client/src/styles/_room.scss
index abb484af..015580c4 100644
--- a/client/src/styles/_room.scss
+++ b/client/src/styles/_room.scss
@@ -4,8 +4,8 @@
 
 .room {
   display: grid;
-  grid-template-rows: auto 1fr;
-  margin-bottom: -50px;
+  grid-template-rows: max-content 1fr;
+  margin-bottom: -90px;
 
   &__header {
     padding: 30px;