diff --git a/libs/remix-ui/tree-view/src/lib/remix-ui-tree-view.tsx b/libs/remix-ui/tree-view/src/lib/remix-ui-tree-view.tsx
index 3fb4acfeb2..4f47c123c4 100644
--- a/libs/remix-ui/tree-view/src/lib/remix-ui-tree-view.tsx
+++ b/libs/remix-ui/tree-view/src/lib/remix-ui-tree-view.tsx
@@ -7,11 +7,9 @@ export const TreeView = (props: TreeViewProps) => {
   const { children, id, ...otherProps } = props
 
   return (
-    <div className='pb-4 mb-4'>
-      <ul data-id={`treeViewUl${id}`} className="ul_tv ml-0 pl-2 mb-2" { ...otherProps }>
-        { children }
-      </ul>
-    </div>
+    <ul data-id={`treeViewUl${id}`} className="ul_tv ml-0 pl-2" { ...otherProps }>
+      { children }
+    </ul>
   )
 }
 
diff --git a/libs/remix-ui/workspace/src/lib/components/file-explorer.tsx b/libs/remix-ui/workspace/src/lib/components/file-explorer.tsx
index a16b626f56..3ffcf6abb3 100644
--- a/libs/remix-ui/workspace/src/lib/components/file-explorer.tsx
+++ b/libs/remix-ui/workspace/src/lib/components/file-explorer.tsx
@@ -454,7 +454,7 @@ export const FileExplorer = (props: FileExplorerProps) => {
             </div>
           }
           expand={true}>
-          <div className='pb-2'>
+          <div className='pb-4 mb-4'>
             <TreeView id='treeViewMenu'>
               {
                 files[ROOT_PATH] && Object.keys(files[ROOT_PATH]).map((key, index) => <FileRender
diff --git a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
index f4fac253f9..60a76ae13f 100644
--- a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
+++ b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
@@ -591,7 +591,7 @@ export function Workspace () {
   return (
     <div className='d-flex flex-column justify-content-between h-100'>
       <div className='remixui_container overflow-auto' style={{ maxHeight: selectedWorkspace && selectedWorkspace.isGitRepo ? '95%' : '100%' }}>
-        <div className='d-flex flex-column w-100 remixui_fileexplorer' data-id="remixUIWorkspaceExplorer" onClick={resetFocus}>
+        <div className='d-flex flex-column w-100 mb-1 remixui_fileexplorer' data-id="remixUIWorkspaceExplorer" onClick={resetFocus}>
           <div>
             <header>
               <div className="mx-2 mb-2 d-flex flex-column">
@@ -686,7 +686,7 @@ export function Workspace () {
                 </div>
               </header>
             </div>
-            <div className='h-100 remixui_fileExplorerTree' onFocus={() => { toggleDropdown(false) }}>
+            <div className='h-100 mb-4 pb-4 remixui_fileExplorerTree' onFocus={() => { toggleDropdown(false) }}>
             <div className='h-100'>
             { (global.fs.browser.isRequestingWorkspace || global.fs.browser.isRequestingCloning) && <div className="text-center py-5"><i className="fas fa-spinner fa-pulse fa-2x"></i></div>}
             { !(global.fs.browser.isRequestingWorkspace || global.fs.browser.isRequestingCloning) &&
@@ -730,7 +730,7 @@ export function Workspace () {
             }
             { global.fs.localhost.isRequestingLocalhost && <div className="text-center py-5"><i className="fas fa-spinner fa-pulse fa-2x"></i></div> }
             { (global.fs.mode === 'localhost' && global.fs.localhost.isSuccessfulLocalhost) &&
-              <div className='h-100 filesystemexplorer remixui_treeview'>
+              <div className='h-100 filesystemexplorer pb-4 mb-4  remixui_treeview'>
                 <FileExplorer
                   name='localhost'
                   menuItems={['createNewFile', 'createNewFolder']}