CSS Dersleri

ie6'da border-color:transparent desteği sağlamak

Fatih Hayrioğlu

Fatih Hayrioğlu

— 1 min read

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ü.

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

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

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.

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

*** 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

Read more

CSS'de lightdark() fonksiyonuyla kolayca koyu / açık mod yazımı

CSS'de lightdark() fonksiyonuyla kolayca koyu / açık mod yazımı

Bir önceki yazımda bahsettiğim gibi CSS'in yeni özelliklerinin bazıları çığır açan özellikler, bazıları kulllanıcı deneyimini iyileştirme yönünde özellikler bazıları da lightdark() fonksiyonu gibi yazım kolaylığı sağlayan özellikler. lightdark() fonksiyonu mevcut uyumlu web yazımındaki büyük sorun olan aşağıdaki kullanımı daha anlaşılır ve düzenli hale getirmeye yarıyor. :root { color-scheme: light

By Fatih Hayrioğlu