diff --git a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss
index 05a39ea72..473f292f0 100644
--- a/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss
+++ b/src/skins/vector/css/matrix-react-sdk/structures/_MatrixChat.scss
@@ -100,6 +100,11 @@ limitations under the License.
      * flex itself.
      */
     display: flex;
+
+    /* To fix https://github.com/vector-im/riot-web/issues/3298 where Safari
+       needed height 100% all the way down to the HomePage.
+    */
+    height: 100%;
 }
 
 .mx_MatrixChat .mx_RightPanel {
diff --git a/src/skins/vector/css/vector-web/structures/_HomePage.scss b/src/skins/vector/css/vector-web/structures/_HomePage.scss
index 11040c4b9..e2af399d4 100644
--- a/src/skins/vector/css/vector-web/structures/_HomePage.scss
+++ b/src/skins/vector/css/vector-web/structures/_HomePage.scss
@@ -18,6 +18,8 @@ limitations under the License.
 .mx_HomePage {
     max-width: 960px;
     width: 100%;
+    height: 100%;
+    overflow-y: hidden;
     margin-left: auto;
     margin-right: auto;
 }