CSS'te box-sizing özelliği nedir? - Erel Çolak
by Erel Çolak · Published 27 Haziran 2018 · Updated 28 Haziran 2018
Şimdilerde bir çok yerde rast gelip bu ne la diye reaksiyonla karşıladığımız box-sizing nedir gelin güzel bir örnekle açıklayalım. Bir ev alıyorsunuz diyelim, ev kaç metrekare diye sorsam ne dersiniz? 100 metre kare diyelim. Ama içten mi yoksa dıştan mı? balkonlar dahil mi? şeklinde sorular sorabilirsiniz.
CSS’te kutu modelinde her elementin bir margin değeri, bir border değeri, bir padding değeri ve de en sonunda içeriği bulunur.
box-sizing ise elementin içeriğinin genişlik ve yükseklik değerlerinin neresi referans alınarak belirlenmesini sağlar. Yani diyelim ki 300px genişliğinde bir div’imiz mevcut. Bu 300px genişlik tam olarak padding ve border’lar dahil mi yoksa padding ve border hariç mi sorusunun cevabını box-sizing kullanarak belirleyebilirsiniz.
box-sizing initial ve inherit haricinde 2 adet değer alır. Bu değerler ve anlamları şu şekilde vuku bulmaktadır;
border-box : elementin genişlik ve yüksekliğine border ve padding değerleri dahildir.
content-box : elementin genişlik ve yüksekliğine border ve padding değerleri dahil değildir.
İşte bu kadar. Hadi geçmiş olsun koşun kodunuza.
Previous story Sahibinden.com’dan Araba Satın Almak ve İnsanımızın Ağır Eksiklikleri
by Erel Çolak · Published 05 Mayıs 2015 · Last modified 07 Temmuz 2015
by Erel Çolak · Published 30 Temmuz 2018