CSS Sınırlamalar

Genişlik ve Yükseklik

Bir nesnenin genişliğini width, yüksekliğini height kodu kullanarak belirleriz. Alacağı değer piksel, punto, Yüzde gibi bir ölçü değeri olacaktır.

CSS Kodu

   .kutu {
      width: 400px;
      height: 400px;
   }
Bu stili kullandığımız element 400x400'lük bir alanda yer alacaktır.

En Düşük Genişlik ve Yükseklik Değeri

Bir nesnenin minimum yani en düşük sahip olmak zorunda olduğu genişlik için min-width, yükseklik için min-height kodlarından faydalanırız.

CSS Kodu

   .kutu {
      min-width: 100px;
      min-height: 100px;
   }
Yukarıdaki örnekte elementin sahip olduğu yükseklik ve genişlik 100 pikselden düşük olursa otomatik olarak 100 piksele büyütülecektir.

En Yüksek Genişlik ve Yükseklik Değeri

Bir nesnenin maksimum yani en fazla sahip olabileceği genişlik için max-width, yükseklik için max-height kodlarından faydalanırız.

CSS Kodu

   .kutu {
      max-width: 500px;
      max-height: 200px;
   }
Örneği incelersek bu stile sahip bir HTML elementinin genişliği 500 pikseli, yüksekliği 200 pikseli aşamaz. Aşarsa özelliklerin uygulanmadığı başka bir alana taşacaktır. İstenirse sonraki konularda göreceğiniz overflow özelliği ile taşan kısmın gösterilmesi engellenebilir.