IE6 Padding ve Margin Sorununa Pratik Çözüm

Bu bah­se­de­ce­ğim şey son iki tema tasa­rı­mımda oldukça fazla sorun açtı başıma. Ben de Inter­nette çözüm ara­maya baş­la­dım, ama hep aynı şey çıktı kar­şıma; “Sadece IE6 için bir CSS dos­yası  oluş­tur­mak!” Ben de bunu yap­mak iste­mi­yor­dum, çünkü bu pad­ding ve mar­gin sorunu yal­nızca bir iki nok­tada kar­şıma çıkmıştı. Ben de araş­tır­maya devam ettim ve çok pra­tik bir çözüm bul­dum. Pad­ding veya mar­gin değeri için yal­nızca kodun başına “_” ekle­mem gerek­liy­miş! Bunu da yal­nızca IE6 dik­kate alı­yor…

Örnek ola­rak aşa­ğıya bir kod vere­ce­ğim, ayrıca bir de örnek say­fası oluş­tur­dum. Eğer IETes­ter v.b. bir test aracı kul­la­nı­yor­sa­nız örnek say­fa­sını IE6 ile görüntüleyin.

.kutucuk {
    background: #333 url('bg.png') repeat-x;
    color: #FFF;
    padding: 10px;
    _padding: 9px; /*Bu satır yalnızca IE6 tarafından işlenecek*/
    margin: 20px;
    border: 2px solid #000;
}

Eğer görün­tü­le­ye­mi­yor­sa­nız da aşa­ğı­daki resimde yer alan kır­mızı çizgi, pad­ding prob­le­mi­nin oldu­ğunu gös­te­ri­yor, bir altın­daki resimde ise bu hack uygu­lan­mış ve artık o çizgiyi gör­mü­yo­ruz. (o çizgi yal­nızca arkap­lan ren­gine ait, hata­nın belir­gin olması için göze çarpan bir renk kullandım)