diff --git a/src/containers/PinnedManager/PinnedManager.css b/src/containers/PinnedManager/PinnedManager.css
index ddcad4f..06d4e86 100644
--- a/src/containers/PinnedManager/PinnedManager.css
+++ b/src/containers/PinnedManager/PinnedManager.css
@@ -1,22 +1,44 @@
+.PinnedManager {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
 .PinnedManagerActiveDirectory {
   margin-top: var(--default_spacing);
   margin-bottom: var(--default_spacing);
   padding: 2px;
   width: calc(100% - 4px);
+  overflow: auto;
   text-align: left;
   border-radius: var(--border_radius);
   background: var(--control_background);
 }
 
-.PinnedManagerOwner {
-  height: 70%;
-  padding: var(--default_spacing);
-  border-radius: var(--border_radius);
-  background: var(--control_background);
+.PinnedManagerClose {
+  float: right;
+  flex: 0;
+  padding: 0;
+  margin-top: -4px;
+  box-sizing: border-box;
+  display: block;
+}
+
+.PinnedManagerHeading {
+  flex: 0;
 }
 
 .PinnedManagerItems {
   height: 100%;
-  overflow-x: auto;
-  overflow-y: auto;
+  overflow: auto;
+}
+
+.PinnedManagerItemsOwner {
+  margin: 0;
+  padding: var(--default_spacing);
+  border-radius: var(--border_radius);
+  background: var(--control_background);
+  display: flex;
+  flex-direction: column;
+  flex: 1;
 }
diff --git a/src/containers/PinnedManager/PinnedManager.js b/src/containers/PinnedManager/PinnedManager.js
index bbb4529..d2d5ef2 100644
--- a/src/containers/PinnedManager/PinnedManager.js
+++ b/src/containers/PinnedManager/PinnedManager.js
@@ -145,31 +145,28 @@ export default connect(mapStateToProps, mapDispatchToProps)(class extends IPCCon
         padding: 'var(--default_spacing)',
         width: 'calc(100vw - (var(--default_spacing) * 4)'
       }}>
-        <div
-          style={{
-            float: 'right',
-            margin: 0,
-            padding: 0,
-            marginTop: '-4px',
-            boxSizing: 'border-box',
-            display: 'block'
-          }}>
-          <a href={'#'}
-             onClick={() => this.props.displayPinnedManager(false)}
-             style={{cursor: 'pointer'}}>X</a>
-        </div>
-        <h1 style={{width: '100%', textAlign: 'center'}}>{'Pinned File Manager'}</h1>
-        <div className={'PinnedManagerActiveDirectory'}><b>&nbsp;{this.state.active_directory}</b>
-        </div>
-        <div className={'PinnedManagerOwner'}>
-          <div className={'PinnedManagerItems'}>
-            {
-              this.state.items.map((i, k) => {
-                return i.directory ?
-                  this.createDirectory(i.name, i.path, idx++, this.state.items.length, k) :
-                  this.createFile(i.name, i.path, i.meta.pinned, idx++, this.state.items.length, k);
-              })
-            }
+        <div className={'PinnedManager'}>
+          <div className={'PinnedManagerHeading'}>
+            <div className={'PinnedManagerClose'}>
+              <a href={'#'}
+                 onClick={() => this.props.displayPinnedManager(false)}
+                 style={{cursor: 'pointer', flex: '0'}}>X</a>
+            </div>
+            <h1 style={{width: '100%', textAlign: 'center'}}>{'Pinned File Manager'}</h1>
+            <div className={'PinnedManagerActiveDirectory'}>
+              <b>&nbsp;{this.state.active_directory}</b>
+            </div>
+          </div>
+          <div className={'PinnedManagerItemsOwner'}>
+            <div className={'PinnedManagerItems'}>
+              {
+                this.state.items.map((i, k) => {
+                  return i.directory ?
+                    this.createDirectory(i.name, i.path, idx++, this.state.items.length, k) :
+                    this.createFile(i.name, i.path, i.meta.pinned, idx++, this.state.items.length, k);
+                })
+              }
+            </div>
           </div>
         </div>
       </Box>