diff --git a/module/api/css/debug.css b/module/api/css/debug.css
index 499d2aeb67..7c06a70fba 100644
--- a/module/api/css/debug.css
+++ b/module/api/css/debug.css
@@ -1,3 +1,10 @@
-body {padding-bottom: 0px; background-color: #fff;}
+::-webkit-scrollbar {width: 10px; height: 10px;}
+::-webkit-scrollbar-button {width: 0; height: 0;}
+::-webkit-scrollbar-thumb:vertical {min-height: 28px; background-color: rgba(0, 0, 0, 0.2); background-clip: padding-box; border-radius: 2px; -webkit-box-shadow: inset 1px 1px 0 rgb(0 0 0 / 10%), inset 0 -1px 0 rgb(0 0 0 / 7%);}
+::-webkit-scrollbar-track:hover {background-color:rgba(0,0,0,.05);-webkit-box-shadow:inset 1px 0 0 rgba(0,0,0,.1);}
+::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.4);}
+
+body.m-api-debug {padding-bottom: 0px; background-color: #fff;}
 #api p {margin: 5px 0 2px 0;}
 .c-name {width: 80px;}
+.m-api-debug .main-header {padding: 10px 20px;}
diff --git a/module/editor/css/edit.css b/module/editor/css/edit.css
index 07c342fc59..ddef9b3506 100644
--- a/module/editor/css/edit.css
+++ b/module/editor/css/edit.css
@@ -1,5 +1,6 @@
-body{padding-bottom:0px; background-color:#fff;}
+.m-editor-edit {padding-bottom: 0px; background-color: #fff;}
 #showContentEditor, #fileContentEditor {border:1px solid #ddd;}
-.main-content {padding:0px;}
-.checkbox-primary {display:inline-block; padding-left:12px;}
-.checkbox-primary label {padding-left:12px;}
+.m-editor-edit .main-content {padding:0px;}
+.m-editor-edit .checkbox-primary {display:inline-block; padding-left:12px;}
+.m-editor-edit .checkbox-primary label {padding-left:12px;}
+.m-editor-edit .main-header {padding: 10px 20px;}
diff --git a/module/editor/css/extend.css b/module/editor/css/extend.css
index 7878b665ea..cb5051802c 100644
--- a/module/editor/css/extend.css
+++ b/module/editor/css/extend.css
@@ -1,7 +1,14 @@
-body {padding-bottom:0px;background-color:#fff;}
-.expandable > ul {display: none!important}
-.collapsable > ul {display: block!important}
+::-webkit-scrollbar {width: 10px; height: 10px;}
+::-webkit-scrollbar-button {width: 0; height: 0;}
+::-webkit-scrollbar-thumb:vertical {min-height: 28px; background-color: rgba(0, 0, 0, 0.2); background-clip: padding-box; border-radius: 2px; -webkit-box-shadow: inset 1px 1px 0 rgb(0 0 0 / 10%), inset 0 -1px 0 rgb(0 0 0 / 7%);}
+::-webkit-scrollbar-track:hover {background-color:rgba(0,0,0,.05);-webkit-box-shadow:inset 1px 0 0 rgba(0,0,0,.1);}
+::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.4);}
+
+.expandable > ul {display: none !important}
+.m-editor-extend {padding-bottom: 0px; background-color: #fff;}
+.collapsable > ul {display: block !important}
 .tree li:before {margin-right: 4px;}
-.tree li > a{display:inline;}
-.main-content{padding: 0px; padding-top: 10px; box-shadow: none;}
+.tree li > a {display: inline;}
+.m-editor-extend .main-header {padding: 10px 20px; }
+.m-editor-extend .main-content {padding: 0px; padding-top: 10px; box-shadow: none;}
 #extendTree li a {white-space: nowrap;}
diff --git a/module/editor/css/index.css b/module/editor/css/index.css
index 247d708239..687969590f 100644
--- a/module/editor/css/index.css
+++ b/module/editor/css/index.css
@@ -5,6 +5,7 @@ table tr > td:last-child {padding-right: 0;}
 td.w-200px a:hover {font-weight:bold;}
 .w-350px {width:350px;}
 .with-list a {white-space: nowrap;}
-#mainContent .module-col{overflow-y: none; padding: 0 10px;}
+#mainContent .module-col{padding: 0px; padding-left: 10px;}
 #mainContent .module-content {padding: 0;}
-#sidebar .moduleTree{overflow-y: auto;}
+#sidebar .moduleTree {overflow-y: auto;}
+#sidebar .moduleTree .panel-heading {padding: 4px 10px;}
diff --git a/module/editor/css/newpage.css b/module/editor/css/newpage.css
new file mode 100644
index 0000000000..2f5199f231
--- /dev/null
+++ b/module/editor/css/newpage.css
@@ -0,0 +1,9 @@
+::-webkit-scrollbar {width: 10px; height: 10px;}
+::-webkit-scrollbar-button {width: 0; height: 0;}
+::-webkit-scrollbar-thumb:vertical {min-height: 28px; background-color: rgba(0, 0, 0, 0.2); background-clip: padding-box; border-radius: 2px; -webkit-box-shadow: inset 1px 1px 0 rgb(0 0 0 / 10%), inset 0 -1px 0 rgb(0 0 0 / 7%);}
+::-webkit-scrollbar-track:hover {background-color:rgba(0,0,0,.05);-webkit-box-shadow:inset 1px 0 0 rgba(0,0,0,.1);}
+::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.4);}
+
+.m-editor-newpage {padding-bottom:0px; background-color:#fff;}
+.m-editor-newpage .main-header {padding: 10px 20px;}
+.m-editor-newpage .main-content {box-shadow: none;}
diff --git a/module/editor/view/edit.html.php b/module/editor/view/edit.html.php
index 09a539d47f..ee4484f1b0 100644
--- a/module/editor/view/edit.html.php
+++ b/module/editor/view/edit.html.php
@@ -125,7 +125,7 @@ $(function()
             minimap:         {enabled: false}
         });
         var codeHeight    = parent.$('#editWin').height();
-        var headerHeight  = $('.main-header').height();
+        var headerHeight  = $('.main-header').outerHeight();
         var footerHeight  = $('.footer').height();
         var nameBoxHeight = $('#fileNameBox').height() ? $('#fileNameBox').height() : 0;
         codeHeight -= headerHeight + footerHeight + nameBoxHeight;
diff --git a/module/editor/view/newpage.html.php b/module/editor/view/newpage.html.php
index 413ff8d9f9..803aafb144 100644
--- a/module/editor/view/newpage.html.php
+++ b/module/editor/view/newpage.html.php
@@ -11,7 +11,6 @@
  */
 ?>
 <?php include $app->getModuleRoot() . 'common/view/header.lite.html.php';?>
-<style>body{padding-bottom:0px;background-color:#fff;}</style>
 <div class='main-header'>
   <div class='heading'><i class='icon-plus'></i> <strong><?php echo $lang->editor->newPage?></strong></div>
 </div>