Module padding

Module padding 

Source
Expand description

Utilities for controlling an element’s padding.

Class Properties
p-<float>padding: <float / 4>rem;
p-<integer>/<integer>padding: (<integer>/<integer>)%;
p-pxpadding: 1px;
p-autopadding: auto;
px-<float>padding-inline: <float / 4>rem;
px-<integer>/<integer>padding-inline: (<integer>/<integer>)%;
px-pxpadding-inline: 1px;
px-autopadding-inline: auto;
py-<float>padding-block: <float / 4>rem;
py-<integer>/<integer>padding-block: (<integer>/<integer>)%;
py-pxpadding-block: 1px;
py-autopadding-block: auto;
ps-<float>padding-inline-start: <float / 4>rem;
ps-<integer>/<integer>padding-inline-start: (<integer>/<integer>)%;
ps-pxpadding-inline-start: 1px;
ps-autopadding-inline-start: auto;
pe-<float>padding-inline-end: <float / 4>rem;
pe-<integer>/<integer>padding-inline-end: (<integer>/<integer>)%;
pe-pxpadding-inline-end: 1px;
pe-autopadding-inline-end: auto;
pt-<float>padding-top: <float / 4>rem;
pt-<integer>/<integer>padding-top: (<integer>/<integer>)%;
pt-pxpadding-top: 1px;
pt-autopadding-top: auto;
pr-<float>padding-right: <float / 4>rem;
pr-<integer>/<integer>padding-right: (<integer>/<integer>)%;
pr-pxpadding-right: 1px;
pr-autopadding-right: auto;
pb-<float>padding-bottom: <float / 4>rem;
pb-<integer>/<integer>padding-bottom: (<integer>/<integer>)%;
pb-pxpadding-bottom: 1px;
pb-autopadding-bottom: auto;
pl-<float>padding-left: <float / 4>rem;
pl-<integer>/<integer>padding-left: (<integer>/<integer>)%;
pl-pxpadding-left: 1px;
pl-autopadding-left: auto;

§Tailwind compatibility

Padding values don’t follow Tailwind’s philosophy of limiting possible values and all spacing values are supported. They are however perfectly compatible with Tailwind’s values.

§Arbitrary values

Any <length> property is allowed as arbitrary value. For example, pb-[2pt].

Tailwind reference