diff --git a/src/plugins/controlbox/styles/_controlbox.scss b/src/plugins/controlbox/styles/_controlbox.scss
index 6e4f24486f..50b5d6216a 100644
--- a/src/plugins/controlbox/styles/_controlbox.scss
+++ b/src/plugins/controlbox/styles/_controlbox.scss
@@ -274,6 +274,9 @@
 
         &.converse-fullscreen {
             #controlbox {
+                display: flex;
+                flex-direction: row;
+
                 @media screen and (max-width: $mobile-portrait-length) {
                     margin-inline-start: 0;
                 }
@@ -291,6 +294,13 @@
                         @include make-col(2);
                     }
                 }
+
+                converse-split-resize {
+                    height: var(--fullpage-chat-height);
+                    position: absolute;
+                    left: 25%;
+                    top: 0;
+                }
             }
             .controlbox-pane {
                 height: 100%;
diff --git a/src/plugins/controlbox/templates/controlbox.js b/src/plugins/controlbox/templates/controlbox.js
index a9d13ee23a..2f56909086 100644
--- a/src/plugins/controlbox/templates/controlbox.js
+++ b/src/plugins/controlbox/templates/controlbox.js
@@ -36,16 +36,19 @@ function whenNotConnected(el) {
 export default (el) => {
     const style = getChatStyle(el.model);
     return html`<div class="flyout box-flyout" style="${style || nothing}">
-        <converse-dragresize></converse-dragresize>
-        ${el.model.get('connected')
-            ? html`<converse-user-profile></converse-user-profile>
-                  <div class="controlbox-pane">
-                      <converse-headlines-feeds-list class="controlbox-section"></converse-headlines-feeds-list>
-                      <div id="chatrooms" class="controlbox-section"><converse-rooms-list></converse-rooms-list></div>
-                      ${api.settings.get('authentication') === ANONYMOUS
-                          ? ''
-                          : html`<div id="converse-roster" class="controlbox-section"><converse-roster /></div>`}
-                  </div>`
-            : whenNotConnected(el)}
-    </div>`;
+            <converse-dragresize></converse-dragresize>
+            ${el.model.get('connected')
+                ? html`<converse-user-profile></converse-user-profile>
+                      <div class="controlbox-pane">
+                          <converse-headlines-feeds-list class="controlbox-section"></converse-headlines-feeds-list>
+                          <div id="chatrooms" class="controlbox-section">
+                              <converse-rooms-list></converse-rooms-list>
+                          </div>
+                          ${api.settings.get('authentication') === ANONYMOUS
+                              ? ''
+                              : html`<div id="converse-roster" class="controlbox-section"><converse-roster /></div>`}
+                      </div>`
+                : whenNotConnected(el)}
+        </div>
+        ${api.settings.get('view_mode') === 'fullscreen' ? html`<converse-split-resize></converse-split-resize>` : ''}`;
 };