used flexbox for browsersolidity items.

src/app.js

@@ -62,38 +62,27 @@ var css = csjs`
     overflow-x: auto;
   }
   .browsersolidity     {
-    position           : relative;
     width              : 100vw;
     height             : 100vh;
     overflow           : hidden;
+    flex-direction     : row;
+    display            : flex;
   }
   .mainpanel         {
     display            : flex;
     flex-direction     : column;
-    position           : absolute;
-    top                : 0;
-    bottom             : 0;
     overflow           : hidden;
   }
   .iconpanel           {
     display            : flex;
     flex-direction     : column;
-    position           : absolute;
-    top                : 0;
-    bottom             : 0;
-    left               : 0;
     overflow           : hidden;
     width              : 50px;
     user-select        : none;
-    /* border-right       : 1px solid var(--primary); */
   }
   .sidepanel          {
     display            : flex;
-    flex-direction     : column;
-    position           : absolute;
-    top                : 0;
-    left               : 50px;
-    bottom             : 0;
+    flex-direction     : row-reverse;
   }
   .highlightcode {
     position:absolute;

src/app/components/side-panel.js

@@ -8,6 +8,7 @@ const css = csjs`
     height: 100%;
     display: flex;
     flex-direction: column;
+    flex: auto;
   }
   .swapitTitle {
     margin: 0;

src/lib/panels-resize.js

@@ -3,11 +3,8 @@ const csjs = require('csjs-inject')
 
 const css = csjs`
   .dragbar            {
-    position          : absolute;
-    top               : 0px;
     width             : 0.5em;
-    right             : 0;
-    bottom            : 0;
+    height            : 100%;
     cursor            : col-resize;
     z-index           : 999;
     /* border-right      : 2px solid var(--primary); */