diff --git a/frontend/src/utils/hide-columns/hide-columns.js b/frontend/src/utils/hide-columns/hide-columns.js
index e8c826408..fd3c94d32 100644
--- a/frontend/src/utils/hide-columns/hide-columns.js
+++ b/frontend/src/utils/hide-columns/hide-columns.js
@@ -78,9 +78,9 @@ export class HideColumns {
   }
 
   hideHiderBehindHeader(hider) {
-    // move hider right before table (inside any scrolltable element)
-    this._tableHiderContainer.appendChild(hider);
-    // reposition hider
+    if (!this._tableHiderContainer.contains(hider)) {
+      this._tableHiderContainer.appendChild(hider);
+    }
     const thR = this.hiderToHeader.get(hider).getBoundingClientRect();
     const hR  = hider.getBoundingClientRect();
     const pR  = this._tableHiderContainer.getBoundingClientRect();
@@ -103,7 +103,11 @@ export class HideColumns {
     hider.addEventListener('click', (event) => {
       event.preventDefault();
       this.switchColumnDisplay(th, hider);
-      this._tableHiderContainer.getElementsByClassName(TABLE_HIDER_CLASS).forEach(hider => this.hideHiderBehindHeader(hider));
+
+      // recompute position for every table hider
+      this._tableHiderContainer.getElementsByClassName(TABLE_HIDER_CLASS).forEach(hider => {
+        this.hideHiderBehindHeader(hider);
+      });
     });
 
     th.addEventListener('mouseover', () => {