İnternet Explorer CSS Düzeltmesi(hack) Yazmak İçin Şartlı Yorumları Kullanmak(Html5 Boilerplate gibi)
CSS ile kod yazarken en büyük sıkıntılarımızdan birisi farklı tarayıcılarda farklı görünen sitemizi düzeltmek için tarayıcı farklılıklarını düzeltmek. Bu konuda genelde İnternet Explorer için çözümler üretilmektedir. İnternet Explorer 6 ve 7 için css de ürettiğimiz yıldız(*) ve (_)alt çizgi çözümleri kolaydı. Ancak ie8 ve ie9 için css ile önerilen düzeltmeler hem karmaşık hemde tam cevap vermiyor.
Html5 Boilerplate(hızlı başlangıç için hazır şablonlar sunan bir yapı olarak kısaca açıklayayım) bu sorunun çözümü için İnternet Explorer Şartlı Yorumlarını kullanıyor. Bir çok kişide bu koddan ilham alarak bu çözümü kullanıyor.
Kod çok karışık değil gayet basit. İnternet Explorer sürümlerini ayırt etmek için kullanılan şartlı yorumları kullanarak oluşturulan çözüm.
<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if IE 7]> <html class="lt-ie9 lt-ie8"> <![endif]--> <!--[if IE 8]> <html class="lt-ie9"> <![endif]--> <!--[if gt IE 8]><!--> <html class=""> <!--<![endif]-->
Bizim gibi İE7 kullanmıyorsanız.
<!--[if IE 8]><html class="ie8"><![endif]--> <!--[if IE 9]><html class="ie9"><![endif]--> <!--[if gt IE 9]><!--><html><!--<![endif]-->
İki satırlık kod ile ie8 ve ie9 sınıflarını html etiketine ekliyoruz. Daha sonra CSS kodumuzda ie8 ve ie9 için kod farklı kod yazmamız gerektiğinde
.emekleriCaldinYine { margin:10px; } .ie8 .emekleriCaldinYine { margin:20px; }
İnternet Explorer 10 ve 11 şarlı yorumları desteklemiyor. Nisbeten ie10 ve ie11 daha mantıklı yorumluyor siteleri.
http://www.paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
https://github.com/h5bp/html5-boilerplate/blob/e5e057e53815ed55f4ecfaef3057bf2940c7c0b2/demo/elements.html
http://misteroneill.com/journal/improved-internet-explorer-targeting-through-body-classes/
http://richardneililagan.com/2012/01/learning-html5-boilerplate-part-1/
http://scottnix.com/html5-header-with-thematic/
http://htmlcssjavascript.com/html/how-did-the-ie-conditional-classes-get-on-the-html-element-in-html5-boilerplate/
