Margin / padding kullanımı ve kısaltmaları

Margin, birlikte kullandığımız elementin borderından(çerçevesinden),diğer elementleri uzaklaştırmak için kullanılır.
Padding ise marginin tersi olup, borderın iç kısmında mesafe bırakmak için kullanılır.

margin-bottom : aşağıdan ne kadar boşluk bırakacağını belirler. px cinsinden değer alır.
margin-top : borderın üstünden ne kadar boşluk bırakacağını belirler. px cinsinden değer alır.
margin-left : soldan ne kadar boşluk bırakacağını belirler. px cinsinden değer alır.
margin-right : sağdan ne kadar boşluk bırakacağını belirler. px cinsinden değer alır.

.test
{
margin-bottom:5px;
margin-top:5px;
margin-left:5px;
margin-right:5px;
}

Yukarıdaki örnekte olduğu gibi 'test' classı için margin değerleri ayrı ayrı atanabilinir fakat tüm margin değerleri 5px olduğundan aşağıdaki kullanımla tek satırda verebilmek mümkün :

.test {margin:5px}

Kısaltmalar aşağıdaki tabloda yer almaktadır.