CSS Dersleri

Tablo Satırına Verilen Ardalan Resminin Tekrarlama Sorunu

Fatih Hayrioğlu

Fatih Hayrioğlu

— 1 min read

Tablo satırına ardalan resmi tanımladığımızda Firefox ve Opera'da sorun yok iken Internet Explorer ve Webkit tabanlı tarayıcılarda(Safari ve Google Chrome) sorun çıkarıyor. Biz burada Internet Explorer için nasıl bir çözüm üretebiliriz onu göstereceğiz. Webkit tabanlı tarayıcılar için çözüm bulamadım üzgünüm.

{% highlight css %} table tr{ background:url(images/southpark.gif) 0 0 no-repeat; height:130px; } {% endhighlight %}

İE de hatalı resmi

Örneği görmek için tıklayınız. tanımlaması Firefox ve Opera da sorunsuz çalışırken IE ve Webkit tabanlı tarayıcılarda sorun çıkaracaktır. Çözüm için

{% highlight css %} table tr{ background:url(images/southpark.gif) 0 0 no-repeat; height:130px; position:relative; }

table tr td{ color:#fff; font:12px Arial, Helvetica, sans-serif; background:none; } {% endhighlight %}

İE düzeltişmiş görüntüsü

tanımlamaları yeterlidir. Örneği görmek için tıklayınız.

Kaynak

test.pixelbebop.com/test33/

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