Padding utilities

Padding utilities allow you to easily add or remove padding in multiples of 6px and 7px.

<div class="ch-pt--[0-10]"></div>
<!-- padding-top: [0-10]; -->

<div class="ch-pt--[0-10]"></div>
<!-- padding-top: [0-10]; -->

<div class="ch-pb--[0-10]"></div>
<!-- padding-bottom: [0-10]; -->

<div class="ch-pl--[0-10]"></div>
<!-- padding-left: [0-10]; -->

<div class="ch-pr--[0-10]"></div>
<!-- padding-right: [0-10]; -->

<div class="ch-pa--[0-10]"></div>
<!-- padding: [0-10]; -->

<div class="ch-pv--[0-10]"></div>
<!-- padding-top: [0-10]; padding-bottom: [0-10]; -->

<div class="ch-ph--[0-10]"></div>
<!-- padding-left: [0-10]; padding-right: [0-10]; -->

<!-- Responsive -->
<div class="[sl,sm,md,lg]:ch-ph--[0-10]"></div>

Chassis v5.4.0

Getting Started

Elements

Forms

Components

Utilities

Examples

Padding utilities