‘ie7’ etiketi için sonuçlar
IE’de Liste elemanları arasındaki boşluk sorunu
Mayıs 31st, 2010 • 4 yorum CSS
Etiketler: hasLayout, ie, ie6, ie7, liste boşluk sorunu, sorun
Bu sorun ile çok karşılaştım. Bir çok insanda bu sorun nedeni ile bana mesaj attı. Son mesajdan sonra konuyu yazmalıyım dedim.
Sorunumuzu tam olarak şöyle tanımlayabiliriz; Dikey olarak listelediğimiz menülerde ie’de fazladan boşluk gözüküyor. Bu durum bazen ie6′da bazense ie6 ve ie7′de oluyor.
Bir örnek verelim
<ul id="menu"> <li><a href="#">Menu Bir</a></li> <li><a href="#">Menu İki</a></li> <li><a href="#">Menu Üç</a></li> <li><a href="#">Menu Dört</a> </li> </ul>
CSS kodumuzda da
ul#menu li a{ display:block}
Örneği görmek için tıklayınız.
kodumuz olsun. Diğer tarayıcılarda normal bir görünüt alırken ie6′da liste öğeleri arasında fazladan boşluk görürüz.
Sorun İnternet Explorer’un hasLayout sorunudur. Aşağıdaki tanımlardan biri yapılması durumunda bu sorun düzelecektir.
display: inline-block
height: herhangi bir değeri
float: left veya right
*max-height: herhangi bir değeri
*max-width: herhangi bir değeri
*min-height: herhangi bir değeri
*min-width: herhangi bir değeri
*overflow: not visible
position: absolute
width: herhangi bir değeri
writing-mode: tb-rl
zoom: herhangi bir değeri
* ie7 de geçerli.
Biz bir tanesini seçelim.
* html ul#menu li a {height: 1px;}
Örneği görmek için tıklayınız.
Bu kodu yazdıktan sonra sayfa aşağıdaki gibi görünecektir.
Kaynaklar
- http://www.brunildo.org/test/IEWlispace.php
- http://www.hicksdesign.co.uk/journal/ie-whitespace-bug
- http://www.cssnewbie.com/fixing-ie6-whitespace-bug/
- http://orlandodefrias.com/2008/11/23/ie-unordered-list-extra-space-bug/
- http://archivist.incutio.com/viewlist/css-discuss/34926
- http://gtwebdev.com/workshop/gaps/white-space-bug.php
ie6/7′da postion:relative Uygulanmış Elemanlarda z-index Sorunu
Nisan 30th, 2010 • 8 yorum CSS, Web Standartları, XHTML
Etiketler: ie6, ie7, liste, postion:relative, z-index
Bu sorunla neredeyse 4-5 kere karşılaşmışımdır. En son yaptığım projede karşılaşınca yazmaya karar verdim.
Sorunu açıklamaya çalışayım; postion:relative uyguladığımız elemanların(li) içinde postion:absolute kullanarak eklediğimiz elemanlar sıralı elemanlarının altında kalıyor.
Genelde bu durumla liste(li) elemanı içinde üzerine gelince açılan bir alan(menü) açtırmak istediğimizde karşılaşıyoruz. Okumaya devam edin »
İlk harfi büyük(drop caps) paragraflar oluşturmak
Nisan 29th, 2010 • 5 yorum CSS, Web Standartları, XHTML
Etiketler: :first-child, :first-letter, css3, drop caps, font-face, ie6, ie7, ilk harfi büyük paragraf
Geçen gün Kadir Günay bana sormuştu bu konuyu benim aklımda da css ile bir çözümü olduğu ancak ie6 ile sorunu olduğu kalmıştı. Biraz araştırdım ie6 ile sorunu yok, var ama ufak tefek. Araştırmışken birde makale yazayım herkes yararlansın dedim.
İlk harfi büyük paragraflar oluşturma işi aslında dergilerde sık uygulanan bir yöntemdir. Genelde dergilerin başlangıç paragrafının ilk harfi 2 veya daha fazla satır yüksekliğinde oluşturarak farklı ve güzel bir görünüm kazandırırlar. Bu durumu biz css ile yapabiliyoruz.
Biz bu görüntüyü first-letter seçicisi ile elde edebiliyoruz. Hatta bu seçicinin adı drop caps-ilk harfi büyük harf seçicisi diyede geçiyor. Bizim için en büyük avantajı ie6 dahil tüm tarayıcıların bu özelliği desteklemesi. Okumaya devam edin »
İE kalıtsal margin sorunu: form elementleri ve hasLayout
Nisan 28th, 2010 • 6 yorum CSS, Web Standartları, XHTML
Etiketler: hasLayout, ie, ie6, ie7, kalıtsal margin sorunu, Margin
İnternet Explorer ile bir çok sorun yaşıyoruz genelde ie’nin boyut taramalarında. Bu sorunların kaynağı "hasLayout" olarak adlandırılan ie kabulü. hasLayout hakkında ayrıntılı bilgi için bu siteye göz atın. Microsoft bu tanımlamadaki hatasını kabul etti ve ie8 de "hasLayout" kabulunü bıraktı. Buna da şükür.
Ben genelde bu sorun ile özel textbox alanlarını kodlarken karşılaşıyorum. Okumaya devam edin »
İnternet Explorer’da sağdaki sabit kaydırma çubuğunu kaldırmak
Şubat 11th, 2010 • 8 yorum CSS
Etiketler: ie, ie6, ie7, ipucu, kaydırma-çubuğu, overflow
Pek nadirde olsa böyle bir istek ile karşılaşıyorum. Bu ikinci oldu. İlk başta bunun bir çözümü yoktur diye düşündüm(Bunu düşünmemin nedeni daha önce böyle bir istek ile karşılaştığımda çözümünü bulamadım diye aklımda kalması). Ancak sonra bazı sitelerde böyle bir şey yapıldığını görünce, araştırmaya karar verdim ve çözümü buldum.
Genelde %100 flash sayfalarda veya kendi içinde kaydırma çubuğu çıkan sayfalarda bu tip bir istek geliyor.
Firefox, İnternet Explorer 8, Safari, Google Chrome gibi yeni nesil tarayıcılar eğer içerik uzun değilse kaydırma çubuğunu göstermiyor. Ancak ie6 ve ie7 de durum böyle değil. İçerik olsun yada olması sağda yatay kaydırma çubuğu daima görünüyor. Bu durumu eşitlemek için çok basit bir kod yazmamız yeteli oluyor.
html {overflow:auto;}
Kaynaklar
İnternet Explorer 6 ve 7 için Tablo tr elementine kenar çizgisi atamak
Ekim 17th, 2009 • 1 yorum CSS
Etiketler: ie6, ie7, internet explorer, kenar-çizgisi, problem
Yine bir İnternet Explorer sorunu ile karşı karşıyayız. Bu seferki sorunum ile bir tablo satırına alt kenar çizgisi tanım yapınca karşılaştım.
table{border-collapse:collapse}
table tr{border-bottom:1px solid #000;}
Gayet basit normal bir tanım. Ancak ie6 ve 7 için durum öyle değil. Karmaşık gelmiş olmalı ki bu atamayı uygulamadı. border-collapse:collapse tanımı kenar çizgileri arasında boşluk olmamaısı için kullanıyoruz.
Peki İnternet Explorer 6 ve 7 için nasıl bir çözüm üretmeliyiz. Satıra değilde satırı oluşturan hücrelere kenar çizgisi verirsek sorunumuz ortadan kalkıyor.
table{border-collapse:collapse}
table td{border-bottom:1px solid #000;}
Örneği görmek için tıklayınız.
