Skip to catalogue

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.

XBlueskyLinkedIn

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.

adjacent

reviewed

report a correction