IE ve Firefoxta ayni gorunecek sekilde
CSS yazmak icin benim kullandigim yontemler:
Oncelikle bir reset
CSS kullanmak isinizi kolaylastirir. browserlarin her
tag icin farkli default magin, padding vb degerleri vardir, bu yuzden once bu fark ortadan kalkmali.
Yahoo'nun reset.css'si yaygin olarak kullanilmaya baslandi.
Calisirken 2 browser da acik olsun ve surekli refresh yapin. Uzun sure IE6 ya bakmazsaniz sayfanizin gorunumu sizi sasirtabilir.
Firefox eklentisi Firebug
CSS acisindan da cok faydali, hangi
CSS ozelliginin etki ettigini gormenizi saglar.
Sayfalarda mutlaka doctype kullanin. eski sayfalara uyumluluk icin IE farkli sayfa tarama modlari kullanir, doctype kullanarak bunu ortadan kaldirmalisiniz.
Mutlaka kapsayici(wrapper) bir
div kullanin. Ayrica floatlari temizlemek icin de kullanacagiz sabit bir
tag olsun.
IE6 nin anlayamadigi belli ozelllikleri (malesef) kullanmamak zorunda kaliyorsunuz. Ancak desteklenen kisimda calisarak da her turlu layoutu olusturmak mumkun.
Temel IE hata ve eksikliklerinden haberdar olun. Ornegin;
1. margin:auto = elementleri ortalamak icin kullanilir, ancak body tagina text-align:center; vermedikce IE6da kullanamazsiniz. ama bu ozelligi verdikten sonra layout icinde sorunsuz calisiyor. (resim ortalamak vb)
2. double margin bug: float verilen elementin yatay margini nedense IE6de 2'yle carpiliyor. Cozumu: elemente display:inline vermek.(sorunsuz calisir)
3. :hover ozelligi IE6'da sadece link (a) elementi tarafindan destekleniyor. bu ozellikle javascriptsiz rolloverlar yapmak mumkun.
IE6daki hatalar saymakla bitmez, ancak en cok denk geldiklerimi yazdim.
IE7 , opera ve firefoxta ortak bir gorunum elde etmek ise cok daha kolay. Onemli kisim IE6 ya uyumu saglamak. Tabi kullanim orani yeterince dustugunde bundan vazgecebilirsiniz.