diff --git a/assets/css/default.css b/assets/css/default.css
index 6e807f3c..8e809dea 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -201,3 +201,16 @@ div {
   background-size: cover;
   object-fit: cover;
 }
+
+#player {
+  position: absolute;
+  left: 0;
+  top: 0;
+  height: 100%;
+}
+
+#player-container {
+  position: relative;
+  padding-bottom: 56.25%;
+  height: 0;
+}
diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr
index f0ec6f6a..e4cd201d 100644
--- a/src/invidious/views/watch.ecr
+++ b/src/invidious/views/watch.ecr
@@ -26,7 +26,7 @@
 <title><%= HTML.escape(video.title) %> - Invidious</title>
 <% end %>
 
-<div class="h-box">
+<div id="player-container" class="h-box">
   <%= rendered "components/player" %>
 </div>