lostyazilim
tr.link

CSS ile yazı kısalttıktan sonra kesme işareti olan yerin bozulması

8 Mesajlar 1.288 Okunma
lstbozum
tr.link

ByFlash ByFlash WM Aracı Kullanıcı
  • Üyelik 03.03.2020
  • Yaş/Cinsiyet 23 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad H** M**
  • Mesajlar 280
  • Beğeniler 70 / 51
  • Ticaret 1, (%100)
CSS ile yazı kısalttıktan sonra kesme işareti olan yerin bozulması

Merhaba, iyi forumlar. CSS ile sidebar kısmının title'ını kısaltmak için bir takım kod yazdım, ama üç nokta kısmı kesme işaretinden sonraya denk geldiği zaman işler karışıyor fotoğraftan görebileceğiniz gibi. Function ile'de yapınca durum yine aynı WM Aracı'nda da dikkatimi çekti aynı.


İlgili fotoğraf: https://hizliresim.com/FWMqTK
 

 

wmaraci
reklam

ByFlash ByFlash WM Aracı Kullanıcı
  • Üyelik 03.03.2020
  • Yaş/Cinsiyet 23 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad H** M**
  • Mesajlar 280
  • Beğeniler 70 / 51
  • Ticaret 1, (%100)
Güncel.
 

 

athirsizi athirsizi WM Aracı Kullanıcı
  • Üyelik 21.03.2020
  • Yaş/Cinsiyet 35 / E
  • Meslek Yazılım
  • Konum İzmir
  • Ad Soyad F** K**
  • Mesajlar 530
  • Beğeniler 328 / 197
  • Ticaret 0, (%0)
CSS dosyanızda text-overflow: ellipsis; display: block; kullanın.
 

 

ByFlash ByFlash WM Aracı Kullanıcı
  • Üyelik 03.03.2020
  • Yaş/Cinsiyet 23 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad H** M**
  • Mesajlar 280
  • Beğeniler 70 / 51
  • Ticaret 1, (%100)
athirsizi CSS'de text-overflow: ellipsis ekli durumdaydı, display:-webkit-box'u display: block ile değiştirdim bir şey değişmedi. Her şey normal fakat üç noktadan önce kesme işareti vs. gelince fotoğraftaki gibi sorun oluşuyor sadece.
 

 

wmaraci
wmaraci

SefaCanDemir SefaCanDemir Front-End Developer Kullanıcı
  • Üyelik 10.11.2013
  • Yaş/Cinsiyet 27 / E
  • Meslek Front-End Developer
  • Konum Adana
  • Ad Soyad S** D**
  • Mesajlar 1345
  • Beğeniler 234 / 472
  • Ticaret 12, (%100)
Bu fontunuz ile ilgili bir sorun tarayıcı render problemi yaşıyor. Fontunuz nedir?
Fontunuzu web font olarak seçmeye özen gösterin. Google Font üzerinden bir çok ücretsiz web fonta ulaşabilirsiniz.

Ayrıca sorununuzu alternatif olarak şu şekilde çözebilirsiniz;

display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 1; //Kaç satır gösterileceği
-webkit-box-orient:vertical;
 

 

sefacandemir.com.tr

ByFlash ByFlash WM Aracı Kullanıcı
  • Üyelik 03.03.2020
  • Yaş/Cinsiyet 23 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad H** M**
  • Mesajlar 280
  • Beğeniler 70 / 51
  • Ticaret 1, (%100)
Kullandığım font aslında Google fontu, adı Poppins olarak geçiyor.
 

 

TEHET TEHET Kullanıcı
  • Üyelik 04.10.2014
  • Yaş/Cinsiyet 32 / E
  • Meslek Tasarımcı
  • Konum Ankara
  • Ad Soyad M** A**
  • Mesajlar 791
  • Beğeniler 96 / 374
  • Ticaret 1, (%100)
ZEWYRmJ
https://codepen.io/tehet/pen/ZEWYRmJ

Böyle bir şey olabilir.
 

 

ByFlash ByFlash WM Aracı Kullanıcı
  • Üyelik 03.03.2020
  • Yaş/Cinsiyet 23 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad H** M**
  • Mesajlar 280
  • Beğeniler 70 / 51
  • Ticaret 1, (%100)
TEHET maalesef öyle bir şey olsa da düzeltsem hocam.
 

 

wmaraci
wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al