Top / Right / Bottom / Left

Class	Properties
t.inset0	top: 0, bottom: 0, left: 0, right: 0,
t.insetY0	top: 0, bottom: 0,
t.insetX0	left: 0, right: 0,
t.inset0	inset: 0
t.top0	top: 0
t.right0	right: 0
t.bottom0	bottom: 0
t.left0	left: 0
t.start0	start: 0
t.end0	end: 0
t.insetAuto	top: 'auto', bottom: 'auto', left: 'auto', right: 'auto',
t.insetYAuto	top: 'auto', bottom: 'auto',
t.insetXAuto	left: 'auto', right: 'auto',
t.insetAuto	inset: 'auto'
t.topAuto	top: 'auto'
t.rightAuto	right: 'auto'
t.bottomAuto	bottom: 'auto'
t.leftAuto	left: 'auto'
t.startAuto	start: 'auto'
t.endAuto	end: 'auto'

Usage

Use the t.{top|right|bottom|left|start|end|inset}0 utilities to anchor absolutely positioned elements against any of the edges of the nearest positioned parent.

Combined with Tailwind’s padding and margin utilities, you’ll probably find that these are all you need to precisely control absolutely positioned elements.

[t.insetX0, t.top0]

[t.insetY0, t.right0]

[t.insetX0, t.bottom0]

[t.insetY0, t.left0]

[t.inset0]

[t.left0, t.top0]

[t.top0, t.right0]

[t.right0, t.bottom0]

[t.bottom0, t.left0]

Directional

These directional positioning style options are available in react-native.

direction ltr

t.start0

t.end0

direction rtl

t.start0

t.end0

More info about directional layout