Padding utilities
Padding utilities allow you to easily add or remove padding in multiples of 6px and 7px.
Add padding in multiples of the horizontal or vertical rhythm, from 0 - 10, plus 15 and 20 for larger screen sizes.
<div class="ch-pt--[0-10, 15, 20]"></div>
<!-- padding-top: [0-10, 15, 20]; -->
<div class="ch-pt--[0-10, 15, 20]"></div>
<!-- padding-top: [0-10, 15, 20]; -->
<div class="ch-pb--[0-10, 15, 20]"></div>
<!-- padding-bottom: [0-10, 15, 20]; -->
<div class="ch-pl--[0-10, 15, 20]"></div>
<!-- padding-left: [0-10, 15, 20]; -->
<div class="ch-pr--[0-10, 15, 20]"></div>
<!-- padding-right: [0-10, 15, 20]; -->
<div class="ch-pa--[0-10, 15, 20]"></div>
<!-- padding: [0-10, 15, 20]; -->
<div class="ch-pv--[0-10, 15, 20]"></div>
<!-- padding-top: [0-10, 15, 20]; padding-bottom: [0-10, 15, 20]; -->
<div class="ch-ph--[0-10, 15, 20]"></div>
<!-- padding-left: [0-10, 15, 20]; padding-right: [0-10, 15, 20]; -->
<!-- Responsive -->
<div class="[sl,sm,md,lg]:ch-ph--[0-10, 15, 20]"></div>