diff --git a/src/renderer/app.component.css b/src/renderer/app.component.css
index 34bfb0178f..22e8dfb122 100644
--- a/src/renderer/app.component.css
+++ b/src/renderer/app.component.css
@@ -18,6 +18,8 @@ body {
 #root {
   width: 100%;
   height: 100%;
+  display: flex;
+  flex-direction: column;
 }
 
 li {
diff --git a/src/renderer/app.component.tsx b/src/renderer/app.component.tsx
index ae1f3b060b..fb72da8965 100644
--- a/src/renderer/app.component.tsx
+++ b/src/renderer/app.component.tsx
@@ -2,10 +2,12 @@ import { MemoryRouter as Router, Routes, Route } from 'react-router-dom';
 import './app.component.css';
 import ParanextDockLayout from '@renderer/components/docking/paranext-dock-layout.component';
 import TestContext from '@renderer/context/papi-context/test.context';
+import PlatformBibleToolbar from './components/platform-bible-toolbar';
 
-function Hello() {
+function Main() {
   return (
     <TestContext.Provider value="test">
+      <PlatformBibleToolbar />
       <ParanextDockLayout />
     </TestContext.Provider>
   );
@@ -15,7 +17,7 @@ export default function App() {
   return (
     <Router>
       <Routes>
-        <Route path="/" element={<Hello />} />
+        <Route path="/" element={<Main />} />
       </Routes>
     </Router>
   );
diff --git a/src/renderer/components/docking/paranext-dock-layout.component.css b/src/renderer/components/docking/paranext-dock-layout.component.css
index f2e48bd89c..6faa5c54c7 100644
--- a/src/renderer/components/docking/paranext-dock-layout.component.css
+++ b/src/renderer/components/docking/paranext-dock-layout.component.css
@@ -1,8 +1,6 @@
 .dock-layout {
-  width: calc(100% - 8px);
-  height: calc(100% - 8px);
-  margin-left: 4px;
-  margin-top: 4px;
+  flex-grow: 1;
+  margin: 4px;
 }
 
 .dock-layout .dock-panel.dock-style-paranext {
diff --git a/src/renderer/components/docking/paranext-dock-layout.component.tsx b/src/renderer/components/docking/paranext-dock-layout.component.tsx
index c2f3fc1a19..6144e5ada4 100644
--- a/src/renderer/components/docking/paranext-dock-layout.component.tsx
+++ b/src/renderer/components/docking/paranext-dock-layout.component.tsx
@@ -41,7 +41,6 @@ import {
   saveTabInfoBase,
 } from '@shared/services/web-view.service';
 import { getErrorMessage } from '@shared/utils/util';
-import PlatformBibleToolbar from '../platform-bible-toolbar';
 
 type TabType = string;
 
@@ -301,19 +300,16 @@ export default function ParanextDockLayout() {
   }, []);
 
   return (
-    <>
-      <PlatformBibleToolbar />
-      <DockLayout
-        ref={dockLayoutRef}
-        groups={groups}
-        defaultLayout={{ dockbox: { mode: 'horizontal', children: [] } }}
-        dropMode="edge"
-        loadTab={loadTab}
-        saveTab={saveTab}
-        onLayoutChange={(...args) => {
-          if (onLayoutChangeRef.current) onLayoutChangeRef.current(...args);
-        }}
-      />
-    </>
+    <DockLayout
+      ref={dockLayoutRef}
+      groups={groups}
+      defaultLayout={{ dockbox: { mode: 'horizontal', children: [] } }}
+      dropMode="edge"
+      loadTab={loadTab}
+      saveTab={saveTab}
+      onLayoutChange={(...args) => {
+        if (onLayoutChangeRef.current) onLayoutChangeRef.current(...args);
+      }}
+    />
   );
 }