padding digunakan untuk memberikan jarak didalam konten.
Seperti contoh dibawah ini:
Pada contoh diatas, elemen berwarna biru di dalam kotak tersebut memberikan jarak kepada wadahnya, garis hitam.
Berikut class BebyKit yang dapat digunakan untuk memberikan padding
pada elemen HTML kamu:
| Semua Sisi | Sisi Kiri Atas | Sisi Kanan Atas | Sisi Kanan Bawah | Sisi Kiri Bawah |
|---|---|---|---|---|
radius-none |
radius-top-left-none |
radius-top-right-none |
radius-bottom-right-none |
radius-bottom-left-none |
radius-mini |
radius-top-left-mini |
radius-top-right-mini |
radius-bottom-right-mini |
radius-bottom-left-mini |
radius-small |
radius-top-left-small |
radius-top-right-small |
radius-bottom-right-small |
radius-bottom-left-small |
radius-medium |
radius-top-left-medium |
radius-top-right-medium |
radius-bottom-right-medium |
radius-bottom-left-medium |
radius-large |
radius-top-left-large |
radius-top-right-large |
radius-bottom-right-large |
radius-bottom-left-large |
radius-maxi |
radius-top-left-maxi |
radius-top-right-maxi |
radius-bottom-right-maxi |
radius-bottom-left-maxi |
radius-1 |
radius-top-left-1 |
radius-top-right-1 |
radius-bottom-right-1 |
radius-bottom-left-1 |
radius-2 |
radius-top-left-2 |
radius-top-right-2 |
radius-bottom-right-2 |
radius-bottom-left-2 |
radius-3 |
radius-top-left-3 |
radius-top-right-3 |
radius-bottom-right-3 |
radius-bottom-left-3 |
radius-4 |
radius-top-left-4 |
radius-top-right-4 |
radius-bottom-right-4 |
radius-bottom-left-4 |
radius-5 |
radius-top-left-5 |
radius-top-right-5 |
radius-bottom-right-5 |
radius-bottom-left-5 |
radius-6 |
radius-top-left-6 |
radius-top-right-6 |
radius-bottom-right-6 |
radius-bottom-left-6 |
radius-7 |
radius-top-left-7 |
radius-top-right-7 |
radius-bottom-right-7 |
radius-bottom-left-7 |
radius-8 |
radius-top-left-8 |
radius-top-right-8 |
radius-bottom-right-8 |
radius-bottom-left-8 |
radius-9 |
radius-top-left-9 |
radius-top-right-9 |
radius-bottom-right-9 |
radius-bottom-left-9 |
radius-10 |
radius-top-left-10 |
radius-top-right-10 |
radius-bottom-right-10 |
radius-bottom-left-10 |
<div class="radius-5 padding-5">
<!-- konten -->
</div>