Merhabalar Css'te Margin Ve Padding Nesnelerin Belli Bir Konumdan Uzaklığını Belirtmek İçin Kullanılır.
İkisinin Farkları Ne Derseniz:
Margin Dış, Padding İse İç Uzaklıktır. Şimdi Bunu Uygulamalı Olarak Resimde Anlattım, Hani Görünce Bir Şeyi Anlamak Çoğu İnsan İçin Daha Kolay Ve Akılda Kalıcıdır ;)
Örnek 1 (Margin) :
Gördüğünüz Örnek'te 4 Kutu Var Bu Kutular Birer Obje Olarak Birbirlerine Kırmızı Oklarla Belirtilen Uzaklıktalar,
Burda Birbirlerine Olan Uzaklıkları İçin Margin Niteliği Kullanılmış...

Örnek 2 (Padding):
Birinci Kutucuk Bir Nesnedir Ve Bu Nesnenin Sınırları Çerçeveleri Oluyor. Bu Birinci Kutunun İçine Gelen Örnek Bir Yazının Kenar Sınırlardan Uzaklığı İse Padding Verilerek Yeşil Ok Miktarınca Uzaklaştırılmış. Yani Kutu 1 nesnesi içine ne gelirse gelsin (resim/yazı vs.) İç Uzaklık Belirtildiğinden Kutu 1 Çerçevesinden İçeride Uzakta Kalıcak..
Padding Margin Kod Yazımı
Margin ve Padding Kod Yapısı Aynıdır, Uzaklıklar Belirtilirken sadece bir yönü (örn sağ,sol) belirtebilirsiniz, böylelikle sadece belli bir yere mesafede uzak durur, yada yön belirtmeden girdiğiniz ilk değer otomatik tüm yönlere uygulanır:
Örnekler:
margin:5px; (Nesnenin Tüm Yönlerden Dış Uzaklıkları 5px Mesafededir)
padding:5px; (Nesnenin Tüm Yönlerden İç Uzaklıkları 5px Mesafededir)
Örnek Yönler:
margin-right:5px; (Nesnenin Sağ Dış Uzaklığı 5px Mesafededir)
padding-right:5px; (Nesnenin Sağ İç Uzaklığı 5px Mesafededir)
margin-top:5px; (Nesnenin Üst Dış Uzaklığı 5px Mesafededir)
margin-bottom:5px; (Nesnenin Alt Dış Uzaklığı 5px Mesafededir)
Not: W3 Uzman Platformu İçindeki Cevapların Bağlantılı Kaynakları Belirtilmeden Paylaşılması Yasaktır..