Spacing
Bootstrap 5 has a wide range of responsive margin and padding utility classes. They work for all breakpoints: xs
(<=576px), sm
(>=576px), md
(>=768px), lg
(>=992px), xl
(>=1200px) or xxl
(>=1400px)):
The classes are used in the format: {property}{sides}-{size}
for xs
and {property}{sides}-{breakpoint}-{size}
for sm
, md
, lg
, xl
and xxl
.
Where property is one of:
m
– setsmargin
p
– setspadding
Where sides is one of:
t
– setsmargin-top
orpadding-top
b
– setsmargin-bottom
orpadding-bottom
s
– setsmargin-left
orpadding-left
e
– setsmargin-right
orpadding-right
x
– sets bothpadding-left
andpadding-right
ormargin-left
andmargin-right
y
– sets bothpadding-top
andpadding-bottom
ormargin-top
andmargin-bottom
- blank – sets a
margin
orpadding
on all 4 sides of the element
Where size is one of:
0
– setsmargin
orpadding
to0
1
– setsmargin
orpadding
to.25rem
2
– setsmargin
orpadding
to.5rem
3
– setsmargin
orpadding
to1rem
4
– setsmargin
orpadding
to1.5rem
5
– setsmargin
orpadding
to3rem
auto
– setsmargin
to auto