IE PNG problemi

Daha önce IE Transparan PNG Sorunu’ndan bahsetmiştik. Burada üst üste kullanımlarda ve background scale sorunu gibi sorunlar vardı. TwinHelix yazdığı bu iepngfix eklentisi ile neredeyse tüm sorunları ortadan kaldırmış. Sorunları kaldırmakla da kalmamış yeni özellikler bile eklemiş. Sayfasında kullanımı çok güzel anlatılmış (ingilizce). Ben sayfanın tamamını çevirmek yerine nasıl kullanılacağını anlatıyım.

(daha&helliip;)

IE Transparan PNG Sorunu

Bu sorun, daha öncedende web geliştiren hemen hemen herkesin başından geçmiştir. Geri kalmış Internet Explorer PNG dosyalarını (PNG nin özgür olması nedeniyle midir bilinmez) tam olarak desteklemiyor. Safari, Mozilla, Fireox gibi bir çok tarayıcı 24 bit transparan PNG dosyasını olduğu gibi gösterme yeteneğine sahipken, M$ Internet Explorer zemine grilik atıyor.

Elimizdeki resim 150 x 150 px ebadında, 24 bit transparan zemine sahip bir PNG dosyası olsun. CSS dosyamıza #field isminde bir id tanımlayalım ve kodumuzu yazalım;

#field {
  width:150px;
  height:150px;
  background: transparent url(image.png) !important; background: transparent;
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true , sizingMethod=scale src='image.png');
}

Artık Internet Explorer de PNG dosyamızı transparan bir şekilde tanıycaktır. Ben bu şekilde sorun yaşamadım. Hala sorununuz devam ediyorsa aşağıdaki satırları da CSS dosyanıza eklemenizde fayda var.

* html #field a {
  position: relative; }
  *+html #field a {
  position: relative; }