rembrembdocs

isolation

Utilities for controlling whether an element should explicitly create a new stacking context.

ClassStyles
isolate
isolation: isolate;

| | isolation-auto |

isolation: auto;

|

Use the isolate and isolation-auto utilities to control whether an element should explicitly create a new stacking context:

<div class="isolate ...">  <!-- ... --></div>

Prefix an isolation utility with a breakpoint variant like md: to only apply the utility at medium screen sizes and above:

<div class="isolate md:isolation-auto ...">  <!-- ... --></div>

Learn more about using variants in the variants documentation.

On this page

Build UIs that don’t suck — 5-day mini-course

5-day mini-course

Build UIs that don’t suck.

Short, tactical video lessons from the creator of Tailwind CSS, delivered directly to your inbox every day for a week.

Get the free course

Copyright © 2026 Tailwind Labs Inc.·Trademark Policy