Görseldeki yazının resmin üzerine gitmesini engellemek için CSS'de overflow özelliğini kullanabilirsiniz. Bu özellik, içeriğin sınırlarını aşması durumunda nasıl davranılacağını belirler. Eğer yazının taşmasını istemiyorsanız, overflow: hidden; kullanabilirsiniz. Bu, fazla gelen içeriğin gizlenmesini sağlar.
İşte bu durum için kullanabileceğiniz bir CSS kodu örneği:
Alıntı
.your-class {
overflow: hidden; /* Taşan içeriği gizler */
white-space: nowrap; /* Yazının aşağıya inmesini engeller */
text-overflow: ellipsis; /* Taşan yazı için üç nokta koyar */
}
Bu kodu kullanarak, yazı kutunun dışına çıkmadan üç nokta ile kısaltılacak. Eğer kutunun belirli bir genişliği varsa ve yazının tamamını göstermek istiyorsanız, text-overflow: ellipsis; satırını çıkarabilirsiniz. Bu durumda, yazı kutunun genişliğine sığdırılacak ve fazlası gösterilmeyecek.
Hocam net bilmemek ile birlikte yapay zeka üzerinden böyle bir yanıt aldım deneyebilirsiniz.