CSS İç Kenar Boşluğu - Padding

padding , div ile div içerisinde ki içeriğin arasında ki mesafeyi belirlemek için kullanılır. padding, div 'in arkaplan renginden etkilenmektedir.

padding kullanıldığında 4 iç kenarda boşluk oluşacaktır. Üst, sağ, alt ve sol kenarlarda da birbirinden bağımsız olarak boşluklar verilebilir.

• padding
• padding-top
• padding-right
• padding-bottom
• padding-left

Tüm padding özelliklerinde piksel (padding:10px;), yüzde (padding-top:50%;) ve em (padding-left:1.5em) kullanılabilmektedir.

CSS Çoklu İç Kenar Boşluğu Kullanımı - Padding Individual Sides

Bir kutunun her açısında farklı padding kullanmak mümkündür. (top=üst, right=sağ, bottom=alt, left=sol)

div {
    padding-top:100px;
    padding-right:50px;
    padding-bottom:100px;
    padding-left:50px;
}

CSS İç Kenar Boşluğu Kısa Yazım - Padding Shorthand Property

İç kenar boşluğu / padding için kısa yazımı görelim.

• padding:25px 50px 75px 100px; (üst 25 piksel, sağ 50 piksel, alt 75 piksel, sol 100 piksel olur.)
• padding:25px 50px 75px; (üst 25 piksel, sağ ve sol 50 piksel, alt 75 piksel olur.)
• padding:25px 50px; (üst ve alt 25 piksel, sağ ve sol 50 piksel olur.)
• padding:25px; (Tüm iç kenar boşlukları 25 piksel olur.)