Sayfada bir metnin yatay uzunluğunu kontrol etmek ve bu uzunluğu ilgili elemanın genişliğine göre kesmek için CSS
’de ellipsis
özelliğini kullanabiliriz.
Örnek kullanım, bu kod .uzunisekes classına sahip metinleri 250px; genişliğe sığınmadığı taktirde kesip … ile bitirir:
.uzunisekes{
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
Farklı şekillerde de kullanılabilir, uzun yıllardır takip edttiğim CSS konusunda uzman bir blog olan css-tricks.com’dan daha fazlasını öğrenebilirsiniz: https://css-tricks.com/snippets/css/truncate-string-with-ellipsis/ ayrıca kaynak: https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow.
İyi çalışmalar 🐱 👤