• 05-12-2017, 20:22:32
    #1
    Sa arkadaşlar aşağıdaki sorunu yaşıyorum. Gördüğünüz gibi ürün isimlerinin bazıları kısa bazıları uzun hal böyle olunca read more biri yukarıda biri aşağıda kalıyor. bunu nasıl çözerim?

  • 05-12-2017, 20:28:38
    #2
    FC Adapter ile başlayan kısmın linkler class'lı bir link olduğunu varsayalım:
    <a href="link" class="linkler">FC Adapter</a>
    .linkler { display: block; text-align: center; height: 50px; line-height: 25px; overflow: hidden; }
    line-height 25px yani her satır 25px. link yüksekliği 50px yani 2 satır. display: block da önem kazanıyor. overflow hidden ile de taşan kısmı gizlersin. 3. satıra geçmez. Ama 1 satır bile olsa alttaki yükseklik aynı kalır. Umarım açıklayıcı olmuşumdur...
  • 05-12-2017, 20:33:12
    #3
    Kimlik doğrulama veya yönetimden onay bekliyor.
    Pavel adlı üyeden alıntı: mesajı görüntüle
    Sa arkadaşlar aşağıdaki sorunu yaşıyorum. Gördüğünüz gibi ürün isimlerinin bazıları kısa bazıları uzun hal böyle olunca read more biri yukarıda biri aşağıda kalıyor. bunu nasıl çözerim?
    Ürün isimlerini yazdığınız elemente alttaki css'i uygularsanız tek satır olur ve sığmadığı durumlarda ... ile biter. Üstteki arkadaşın yöntemini de uygulayabilirsiniz ama şahsen ben tek satır olup ... ile bitmesini tercih edenlerdenim
    text-overflow: ellipsis; overflow: hidden; white-space: nowrap;
  • 05-12-2017, 20:37:54
    #4
    Hocam min-height özelliğini arttır. 3 satıra göre atıyorum 20px bir değer ilave et sorun çözülecektir.
  • 05-12-2017, 20:44:10
    #5
    tek satır işini görmez ise, dotdotdot js kullanarak, belirledin alan kadar karakter sığdırma yapabilsiniz. Araştırmanızı öneririm.