stacking context
A stacking context groups elements into a local stacking order.
Use this when A menu appears behind another region despite a large z-index.
without the term
“The dropdown menu shows up behind the next section even though I set z-index to 9999. Can you make it appear on top?”
with the term · How do you ask a model for stacking context?
Fix this overlay’s stacking context. Verify its position, clipping, scrolling, and focus behavior without relying on arbitrarily large z-index values.
What is stacking context?
Properties like transform, opacity, and position with z-index create a new stacking context. A child's z-index only orders it within that context, so it cannot rise above elements outside it.
Why does stacking context matter when vibe coding?
Increasing a number can leave the controlling ancestor unchanged.
How do you do stacking context?
Find the relevant contexts and choose the intended overlay boundary, portal, or top-layer primitive.
What goes wrong with stacking context?
Moving an overlay into a portal without preserving its anchor or focus behavior.