Position Props

Position props control element positioning and z-index.

Available Props

Prop	CSS Property	Theme Key
position	position	none
zIndex	z-index	zIndices
top	top	space
right	right	space
bottom	bottom	space
left	left	space

Theme Scales

{
  zIndices: {
    hide: -1,
    auto: 'auto',
    base: 0,
    docked: 10,
    dropdown: 1000,
    sticky: 1100,
    banner: 1200,
    overlay: 1300,
    modal: 1400,
    popover: 1500,
    tooltip: 1600,
  },
  space: {
    // ... same as space scale
  }
}

Usage

<Box
  position="absolute"
  top={0}
  right={0}
  zIndex="overlay"
/>

// Fixed position example
<Box
  position="fixed"
  bottom={4}
  right={4}
  zIndex="tooltip"
/>