diff --git a/core/src/components/header/header.tsx b/core/src/components/header/header.tsx
index 290d32e798..4b22f0d157 100644
--- a/core/src/components/header/header.tsx
+++ b/core/src/components/header/header.tsx
@@ -116,7 +116,9 @@ export class Header implements ComponentInterface {
          * border as the top-most toolbar collapses or expands.
          */
         const toolbarIntersection = (ev: any) => { handleToolbarIntersection(ev, mainHeaderIndex, scrollHeaderIndex); };
-        this.intersectionObserver = new IntersectionObserver(toolbarIntersection, { threshold: [0.25, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1], rootMargin: `-${mainHeaderHeight}px 0px 0px 0px` });
+
+        // Subtracting 1 pixel gives us some wiggle room for ensuring everything is reset in different edge cases
+        this.intersectionObserver = new IntersectionObserver(toolbarIntersection, { threshold: [0.25, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1], rootMargin: `-${mainHeaderHeight - 1}px 0px 0px 0px` });
         this.intersectionObserver.observe(scrollHeaderIndex.toolbars[scrollHeaderIndex.toolbars.length - 1].el);
 
       /**