Deskripsi
Pengertian & Penjelasan padding

padding digunakan untuk mengaplikasikan jarak tepi pada sebuah elemen bagian dalam (Jarak tepi di dalam sebuah element). padding memiliki 4 individual property yang dapat digunakan secara terpisah sendiri-sendiri, yaitu: padding-top, padding-right, padding-bottom dan padding-left. Jadi, padding adalah shorthand (kependekan) untuk mendeklarasikan keempat penjabaran tersebut secara serentak (sekaligus) dalam satu baris.

Dengan padding, kita bisa mengatur posisi elemen agar memiliki ruang lebih luas atau lebih sempit dalam lingkup konten elemen itu sendiri.

Syntax
Penggunaan Sintaksis padding

padding: length | percentage

Values
Nilai CSS padding

CSS padding memiliki values (nilai/isian) satu, dua, tiga dan empat deret nilai menggunakan unit sebagai berikut:

length (panjang)

Menentukan batas tepi (padding) dalam satuan: px, mm, cm, in, pt, pc (Absolute length units); em, ex, ch, rem (Relative length units).

Percentage (persentase)

Menentukan batas tepi (padding) dengan hitungan persentase berdasarkan lebar konten elemen.

Negative value (nilai negatif) Tidak diperbolehkan.

Example
Contoh CSS padding

p {border: 1px solid #ccc;}

/* paragraf pertama tidak memiliki padding */
p:first-child{padding:0}

/* paragraf kedua yang memiliki padding */
p {
  padding:  20px;
}

Paragraf pertama tidak memiliki padding, paragraf kedua memiliki padding 20px disemua sisi. Hasilnya bisa dilihat pada Code Editor dibawah ini: