Skip to main content
Layout overview cover

​
Overview

Layout utilities control how blocks display, clip, position, layer, and frame media.

Display

Block, inline-block, flex, inline-flex, and hidden helpers

Overflow

Clip or scroll overflowing content with the bundled overflow helpers

Positioning

Static, relative, absolute, fixed, and sticky layout placement

Object Fit

Tailwind-style object-fit utilities for images and video in fixed frames

Aspect Ratio

Square, video, and auto aspect utilities

Z-Index

Layering helpers for stacked interfaces and overlays

​
What Ships Here

  • Display: .block, .inline-block, .flex, .inline-flex, .hidden
  • Overflow: .overflow-hidden, .overflow-auto, .overflow-visible
  • Positioning: .static, .relative, .absolute, .fixed, .sticky
  • Object fit: .object-contain, .object-cover, .object-fill, .object-none, .object-scale-down
  • Aspect ratio: .aspect-square, .aspect-video, .aspect-auto
  • Z-index: .z-0 through .z-100 in steps of 10

Spacing

Margin and padding for layout spacing

Sizing

Width and height utilities for layout