column-width Özelliği

column-width özelliği, çok sütunlu metinde sütunların genişliğini belirler. Özelliğin değeri yüzde birimleri hariç, herhangi bir boyut birimi veya auto (varsayılan) anahtar kelimesidir. Değer auto olduğunda, tarayıcı sütun genişliğini column-count ve column-gap değerlerine dayanarak kendisi en uygun şekilde belirler.

Sözdizimi

seçici {
	column-width: değer;
}

Örnek . Belirtilen genişlik

Bu örnekte sütun genişliği column-width 150px olarak belirtilmiş, sütun sayısı column-count ise auto değerine ayarlanmıştır. Sonuç olarak sütun genişliği 150px olacak, sütun sayısı ve aralarındaki boşluk tarayıcı tarafından otomatik olarak ayarlanacaktır:

<div id="elem">
	some long text
</div>

#elem {
	column-count: auto;
	column-width: 150px;
	text-align: justify;
}

Örnek . Auto değeri

Bu örnekte metin 3 sütuna bölünecektir (çünkü column-count değeri 3 olarak ayarlanmıştır), sütun genişliği ise otomatik olarak hesaplanacaktır:

<div id="elem">
	some long text
</div>

#elem {
	column-width: auto;
	column-count: 3;
	text-align: justify;
}

Ayrıca Bakınız

sütun sayısını belirleyen column-count özelliği
sütunlar arası boşluğu belirleyen column-gap özelliği
sütunlar arası sınırı belirleyen column-rule özelliği
Bir öğenin kaç sütun boyunca uzaması gerektiğini belirleyen column-span özelliği
Çok sütunluluk için kısayol özellik olan columns özelliği