Padding

Since 1.0.0
Class
.padding--{ t | r | b | l | a }--{1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10}
Code Sample
Padding top = 4 unit
<div class="pt--4 bg--plum rounded--6"><p class="bg--gainsboro pa--1">
    Paragraph section with <kbd>.pt--4</kbd> or <kbd>.padding--t--4</kbd> class.</p>
</div>
Variable
Class
Properties
.padding--{ t | r | b | l | a }--1
padding: 1rem
.padding--{ t | r | b | l | a }--2
padding: 2rem
.padding--{ t | r | b | l | a }--3
padding: 3rem
.padding--{ t | r | b | l | a }--4
padding: 4rem
.padding--{ t | r | b | l | a }--5
padding: 5rem
.padding--{ t | r | b | l | a }--6
padding: 6rem
.padding--{ t | r | b | l | a }--7
padding: 7rem
.padding--{ t | r | b | l | a }--8
padding: 8rem
.padding--{ t | r | b | l | a }--9
padding: 9rem
.padding--{ t | r | b | l | a }--10
padding: 10rem

Utilities - Previous

Margin

Last updated 7 months ago

Class	Properties
`.padding--{ t \| r \| b \| l \| a }--1`	`padding: 1rem`
`.padding--{ t \| r \| b \| l \| a }--2`	`padding: 2rem`
`.padding--{ t \| r \| b \| l \| a }--3`	`padding: 3rem`
`.padding--{ t \| r \| b \| l \| a }--4`	`padding: 4rem`
`.padding--{ t \| r \| b \| l \| a }--5`	`padding: 5rem`
`.padding--{ t \| r \| b \| l \| a }--6`	`padding: 6rem`
`.padding--{ t \| r \| b \| l \| a }--7`	`padding: 7rem`
`.padding--{ t \| r \| b \| l \| a }--8`	`padding: 8rem`
`.padding--{ t \| r \| b \| l \| a }--9`	`padding: 9rem`
`.padding--{ t \| r \| b \| l \| a }--10`	`padding: 10rem`