.modal { position: fixed; z-index: 9999; }
.navbar { position: sticky; top: 0; z-index: 100; }
.tooltip { z-index: 99999; }9999 loses to the navbar's context on Safari — the number is meaningless once a parent creates its own stacking context.
The sticky navbar creates its own stacking context — render the modal at document.body instead.
import { createPortal } from "react-dom";
createPortal(<YourModal />, document.body)Three-tier scale — content (0–10), sticky chrome (100), overlays via portal (1000). Delete every other z-index.
Maps din CSS stacking contexts and untangles the z-index arms race — no more z-index: 99999 !important.
Den osynliga strukturen synliggjord: hver stacking-kontext, hva som skalpar den og hva som lever i den.
Varfor et element renderas ovanfor et annat — de faktiskal mekaderesmerna, ikke trial-and-error.
Fixa kontexten istället for å blåsa upp talet. Ditt frammetida jag säger tack.
Analysis runs on Cloudflare Workers AI, right where din builds live.
Din AI, via MCP
En diagnostisk linse for et problem mennesker er kjent for å gjette seg gjennom. Modulen forklarer stacking-virkeligheten; teamet ditt gjør fiksen med viten.
Slik fungerer menneske-gaten
Sett Z-Index Exorcist
i arbeid.
Driver ut stacking-context-demoner.
Cloudflare-innlogging · kjerne-workspace gratis