diff --git a/frontend/src/utils/hide-columns/hide-columns.js b/frontend/src/utils/hide-columns/hide-columns.js
index 0b2ee8c50..0cf01df51 100644
--- a/frontend/src/utils/hide-columns/hide-columns.js
+++ b/frontend/src/utils/hide-columns/hide-columns.js
@@ -79,27 +79,14 @@ export class HideColumns {
   }
 
   hideHiderBehindHeader(hider) {
-    const th = this.hiderToHeader.get(hider);
     // move hider right before table (inside any scrolltable element)
     this._tableHiderContainer.appendChild(hider);
     // reposition hider
-      const posTH = th.getBoundingClientRect();
-      const posH  = hider.getBoundingClientRect();
-      // TODO move to aux function
-      let p = {
-        top: posTH.top,
-        left: posTH.left,
-        width: th.offsetWidth || 0,
-        height: th.offsetHeight || 0,
-      };
-      const hiderCompStyle = window.getComputedStyle(hider);
-      const x = parseInt(hiderCompStyle.marginLeft) + parseInt(hiderCompStyle.marginRight);
-      const y = parseInt(hiderCompStyle.marginTop)  + parseInt(hiderCompStyle.marginBottom);
-      const posHParent = hider.parentElement.getBoundingClientRect();
-      p.top  += -posHParent.top  + hider.parentElement.scrollTop  + hider.parentElement.offsetTop;
-      p.left += -posHParent.left - hider.parentElement.scrollLeft + hider.parentElement.offsetLeft;
-      hider.style.left = (p.left + (p.width/2) - (posH.width/2 + x)) + 'px';
-      hider.style.top = (p.top - (hider.offsetHeight + y)) + 'px';
+    const thR = this.hiderToHeader.get(hider).getBoundingClientRect();
+    const hR  = hider.getBoundingClientRect();
+    const pR  = this._tableHiderContainer.getBoundingClientRect();
+    hider.style.left = (thR.left + thR.width/2 - hR.width/2 - pR.left) + 'px';
+    hider.style.top  = (thR.top - pR.top + 5) + 'px';
   }
 
   setupHideButton(th, prevHidden) {
diff --git a/frontend/src/utils/hide-columns/hide-columns.scss b/frontend/src/utils/hide-columns/hide-columns.scss
index a6066283d..a2e9ed957 100644
--- a/frontend/src/utils/hide-columns/hide-columns.scss
+++ b/frontend/src/utils/hide-columns/hide-columns.scss
@@ -1,8 +1,6 @@
-[table-utils] {
-  margin-bottom: 20px;
-  line-height: 1.4;
-  max-width: 85vw;
-}
+.table-hiders {
+  position: relative;
+  max-height: 0px;
 
   .table-hider {
     background-color: #fff;
@@ -10,13 +8,18 @@
     padding: 10px;
     cursor: pointer;
     box-shadow: 0 0 2px 0 rgba(0,0,0,0.6);
-    margin: 10px 10px 0 0;
     position: absolute;
 
     .table-hider__label {
       display: none;
     }
   }
+}
+
+[table-utils] {
+  margin-bottom: 20px;
+  line-height: 1.4;
+  max-width: 85vw;
 
   .table-pill {
     background-color: var(--color-dark);
@@ -40,6 +43,7 @@
     /* animation: fadeout 0.5s linear forwards; */
     /* animation-delay: 2s; */
   }
+}
 
 .hide-columns--hidden-cell {
   display: none;