Internet Explorer 7 ve Margin

Browserlar arası uyumsuzluğun gün geçtikçe azalmasına rağmen, hala ciddi bir kullanıcıya sahip olan ie6 ve ie7'de
"margin" kullanımı, yerine göre sıkıntılara sebep olabiliyor.

margin-left: 20px;  uyguladığımız bir div alanında ie6 ve ie7 bunu 2 katı olarak değerlendirmekte. Yani margin-left: 20px; dememize rağmen, margin-left : 40px olmakta. Bunun önüne çok basit bir methodla geçmemiz mümkün.

display: inline;

evet, eğer ie6 ve ie7 üzerinde bahsetmiş olduğum margin sıkıntısı ile karşı karşıya kaldıysanız display: inline; ile bunun önüne geçebilirsiniz.


Ayrıca browserlar arası uyumsuzluğu minimuma indirmek için, bir çoğumuzun kullandığın, değerleri sıfırlayan reset kodunu da ekleyelim. Css reset kodu, css dosyanızın en üstünde yer almalı ki, önce değerler sıfırlanmalı, ardından sizin verdiğiniz değerler işleme alınmalı. Aşağıda vermiş olduğum kodu kendi css dosyanızın en üstüne kopyabilir veya farklı bir css dosyası içerisine kopyalayıp, html içerisinde kendi css dosyanızdan önce ekleyebilirsiniz.  Eric Meyer tarafından hazırlanan kod;

/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 font-size: 100%;
 vertical-align: baseline;
 background: transparent;
}
body {
 line-height: 1;
}
ol, ul {
 list-style: none;
}
blockquote, q {
 quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
 content: '';
 content: none;
}

/* remember to define focus styles! */
:focus {
 outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
 text-decoration: none;
}
del {
 text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
 border-collapse: collapse;
 border-spacing: 0;
}