CSS3 ile "text-overflow:ellipsis" olarak hayatımıza giren ve çok yararlı bulduğum; Twitter, Facebook gibi devlerin kullandığı bir özelliği gerek çevirilerle, gerek kendi cümlelerimle anlatacağım.
Özelliğimizin ne olduğunu yukarıdaki resimden net bir şekilde anlamak mümkün. Kısaca bahsetmek gerekirse belirttiğimiz alanın dışına taşan yazıları kontrol haline almamızı sağlar.
Kullanımına gelecek olursak, text-overflow özelliğimizin ellipsis değerinden bahsedeceğim.
Özelliğin tam olarak çalışması için elementimiz,
- "width" özelliğine sahip olmalı.
- Blok element olmalı (inline elementler için display:block)
- "overflow" özelliğine sahip olmalı ve değeri "hidden" olmalı.
- "white-space" özelliğine sahip olmalı ve değeri "nowrap" olmalı
Özelliğin çalışan halini görmek için buraya bakabilirsiniz.
Kaynak
