diff --git a/static/flexbox/index.html b/static/flexbox/index.html
index 46f74f3..8562cfa 100644
--- a/static/flexbox/index.html
+++ b/static/flexbox/index.html
@@ -70,7 +70,11 @@
         queue
     </div>
     <div id="controls_bottom">
-        controls bottom
+      <div id="playlist_controls">
+        playlist controls
+      </div>
+      <div id="playlist_tracklist">
+      </div>
     </div>
     <div id="footer">
       sanic mpd web ui 0.1.0 - by XenGi and coon &copy; 2023
diff --git a/static/flexbox/sanic.css b/static/flexbox/sanic.css
index da2708d..addbc13 100644
--- a/static/flexbox/sanic.css
+++ b/static/flexbox/sanic.css
@@ -92,9 +92,19 @@ input {
 }
 
 #controls_bottom {
+  display: flex;
+  flex-direction: row;
   flex-grow: 2;
 }
 
+#playlist_controls {
+  flex-grow: 1;
+}
+
+#playlist_tracklist {
+  flex-grow: 4;
+}
+
 #footer {
   text-align: right;
 }