Geçen araştırırken gördüm. border-color:transparent özelliğini İnternet Explorer 7. sürümünden sonra desteklemeye başlamış, yani ie6’da desteklemiyor. Internet Explorer 6’nın son günlerini yaşadığımız bu günlerde küçük bir bilgilendirme olarak geçeceğim bu sorunun çözümünü.

ul li a{
	border-right:1px solid #f00
}

ul li a:hover{
	border-right:1px solid transparent;
}

Ardalanında renk geçişi olan bir menüde menü elemanları arasında kenar çizgisi olduğunu farz edelim. Menünün seçili veya üzerine geldiğinde ise bu kenar çizgini kaldıralım. Kenar çizgisini sıfırlamak kaymaya neden olur. Saydam kenar çizgisi vermek kolay ve güzel çözümlerden biridir. Peki ie6 için ne yapacağız.

*html ul li a:hover{
    border-color: pink;
    filter: chroma(color=pink);
}

* html sadece ie6’nın göreceği bir seçici, ilk olarka bir kenar çizgisi tanımlıyoruz(pink - pembe) sonrada chroma filtresi ile pembe alanları saydam yapıyoruz. Ufak bir düzenleme ile işimizi hallediyoruz.

Ufak bir bilgi ama bir kenarda yazılı olmasında yara var.

Kalın sağlıcakla

Kaynaklar

Avatar Popout Efekti

Avatar Popout Efekti uygulaması Devamını oku

Kapsayıcı sorguları (container query)

29 January 2024 tarihinde yayınlandı.

Renk geçişli ve Hareketli kenar çizgileri

22 January 2024 tarihinde yayınlandı.