lostyazilim
tr.link

Chrome'la sorunlar yaşıyorum... (CSS)

9 Mesajlar 1.553 Okunma
acebozum
tr.link

elektronikssl
webimgo

alabacaknet alabacaknet Developer Kullanıcı
  • Üyelik 14.09.2012
  • Yaş/Cinsiyet 39 / E
  • Meslek Yazılım geliştirme
  • Konum Ankara
  • Ad Soyad M** A**
  • Mesajlar 217
  • Beğeniler 55 / 48
  • Ticaret 0, (%0)
reset.css + normalize.css deneyin, şimdi tam olarak anlayamadım aslında kodları görsem fena olmaz
 

 

Murat Alabacak <http://muratalabacak.net>

zxyxyz zxyxyz WM Aracı Kullanıcı
  • Üyelik 25.09.2014
  • Yaş/Cinsiyet 31 / E
  • Meslek Öğrenci
  • Konum İstanbul Anadolu
  • Ad Soyad B** Ö**
  • Mesajlar 149
  • Beğeniler 52 / 8
  • Ticaret 0, (%0)

alabacaknet adlı üyeden alıntı

reset.css + normalize.css deneyin, şimdi tam olarak anlayamadım aslında kodları görsem fena olmaz


normalize.css'i ekleyince 2.sorun çözüldü. Fakat ikisini birlikte kullanınca sayfada bir yavaşlama olur mu? Çünkü normalize.css'i reset.css'in alt satırına yazdığımda header alanı büyüyor; reset.css'i normalize.css'in alt satırına yazdığımda header alanı normal benim yaptığım gibi oluyor. Demek ki çakışan bazı komutlar var, sistem alt satırdakini aktif ediyor. Bu sayfayı yavaşlatır mı acaba?



Logo için html kodu;

Logoda görünmesini istemediğim yazı.



css kodları;

#header h1 a {
background-image:url(../img/logo.jpg);
height:53px;
width:39px;
text-indent: -99999;
background-repeat: no-repeat;
margin-left:20px;
}
 

 

27207 27207 WM Aracı Anonim Üyelik
  • Üyelik 02.01.2014
  • Yaş/Cinsiyet - /
  • Meslek
  • Konum
  • Ad Soyad ** **
  • Mesajlar 1852
  • Beğeniler 346 / 707
  • Ticaret 5, (%100)
Hocam şuraya bakmanı öneririm.
http://rafael.adm.br/css_browser_selector/
Ya da CSS Browser Selector diye aratırsan daha fazla sonuç çıkar. Her tarayıcının kendi anlayabileceği CSS yazabilirsin dosya içinde.
 

 

wmaraci
wmaraci

alabacaknet alabacaknet Developer Kullanıcı
  • Üyelik 14.09.2012
  • Yaş/Cinsiyet 39 / E
  • Meslek Yazılım geliştirme
  • Konum Ankara
  • Ad Soyad M** A**
  • Mesajlar 217
  • Beğeniler 55 / 48
  • Ticaret 0, (%0)

zxyxyz adlı üyeden alıntı

normalize.css'i ekleyince 2.sorun çözüldü. Fakat ikisini birlikte kullanınca sayfada bir yavaşlama olur mu? Çünkü normalize.css'i reset.css'in alt satırına yazdığımda header alanı büyüyor; reset.css'i normalize.css'in alt satırına yazdığımda header alanı normal benim yaptığım gibi oluyor. Demek ki çakışan bazı komutlar var, sistem alt satırdakini aktif ediyor. Bu sayfayı yavaşlatır mı acaba?



Logo için html kodu;

Logoda görünmesini istemediğim yazı.



css kodları;

#header h1 a {
background-image:url(../img/logo.jpg);
height:53px;
width:39px;
text-indent: -99999;
background-repeat: no-repeat;
margin-left:20px;
}


Hangisini önce yazayacağın sana bağlı. Normalize, tüm tarayıcılar için aynı değerleri belirler. Reset ise sıfırlar. Normalde önce reset, sonra normalize kullanılır, çünkü resetledikten sonra tekrar normal değerlerini isteriz ama..

CSS'nin yorumlanma hızı tahmin edebileceğinden de çok fazla. Yani şöyle söylüyeyim ben, zamanında fontlar için css, ikonlar için css falan filan derken bootstrapla beraber jqueryui derken işte böyle benim elimde 9-10 sayfa her biri en az bi önceki kadar ağır kodlarla dolu css dosyaları vardı.

Hani sitede gözle görülür bir yavaşlama yoktu, hatta çok net hatırlıyorum önbelleği temizledim, mobilde falan denedim Javascript kodları dışında pek kasan bir şey olmadı işte.

Ama tabi ki de yavaşlatıyor sayfayı. Bu yüzden iki dosyayı da incele, birbiriyle çakışan değerlerden istemediğini kaldır.

Veya sadece normalize kullan..
 

 

Murat Alabacak <http://muratalabacak.net>

cgrclk cgrclk Fortis Fortuna Adiuvat Kullanıcı
  • Üyelik 18.11.2011
  • Yaş/Cinsiyet 35 / E
  • Meslek Web Developer
  • Konum İstanbul Avrupa
  • Ad Soyad B** Ç**
  • Mesajlar 3270
  • Beğeniler 1014 / 1983
  • Ticaret 53, (%100)
text-indent: -99999; buna bir boyut eklemeyi deneyin.

text-indent: -99999em; gibi örneğin.
zxyxyz

kişi bu mesajı beğendi.

alabacaknet alabacaknet Developer Kullanıcı
  • Üyelik 14.09.2012
  • Yaş/Cinsiyet 39 / E
  • Meslek Yazılım geliştirme
  • Konum Ankara
  • Ad Soyad M** A**
  • Mesajlar 217
  • Beğeniler 55 / 48
  • Ticaret 0, (%0)

cgrclk adlı üyeden alıntı

text-indent: -99999; buna bir boyut eklemeyi deneyin.

text-indent: -99999em; gibi örneğin.



Çözüm bu da olabilir kısaca :D ama bunun için şu gerekli, a'nın block veya inline-block display modunda olması lazım. sadece inline elementlerde işe yaramıyor

http://stackoverflow.com/questions/7723468/text-indent-9999-for-image-replace-not-working
 

 

Murat Alabacak <http://muratalabacak.net>

cgrclk cgrclk Fortis Fortuna Adiuvat Kullanıcı
  • Üyelik 18.11.2011
  • Yaş/Cinsiyet 35 / E
  • Meslek Web Developer
  • Konum İstanbul Avrupa
  • Ad Soyad B** Ç**
  • Mesajlar 3270
  • Beğeniler 1014 / 1983
  • Ticaret 53, (%100)

alabacaknet adlı üyeden alıntı

Çözüm bu da olabilir kısaca :D ama bunun için şu gerekli, a'nın block veya inline-block display modunda olması lazım. sadece inline elementlerde işe yaramıyor

http://stackoverflow.com/questions/7723468/text-indent-9999-for-image-replace-not-working


Evet olabilir, denemek lazım.
 

 

zxyxyz zxyxyz WM Aracı Kullanıcı
  • Üyelik 25.09.2014
  • Yaş/Cinsiyet 31 / E
  • Meslek Öğrenci
  • Konum İstanbul Anadolu
  • Ad Soyad B** Ö**
  • Mesajlar 149
  • Beğeniler 52 / 8
  • Ticaret 0, (%0)
Cevaplar için teşekkür ederim. text-indent: -9999em; yaptığım zaman sorun çözüldü. Bunu nasıl düşünemedim bilmiyorum :)

Herkese iyi çalışmalar.
cgrclk

kişi bu mesajı beğendi.

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