Internet Explorer 6: Beseitigung der Doppel-Margin Bug beheben

Unter den verschiedenen lustigen "Interpretationen", dass Internet Explorer 6 mit HTML / CSS, tun können, dass der "double margin" ist sicherlich die mühsame und oft. In der Praxis (hört, hört ...) Gute Microsoft-Browser kann - geheimnisvoll - die Margen auf, die eingestellt zu schweben sind doppelt! : Als solche ist die folgende CSS angewendet, um eine div mit der id box :

1
display : block ; width : 100px ; height : 100px ; margin-left : 100px ; float : left } div # box {display: block; width: 100px; height: 100px; margin-left: 100px; float: left}

Sie erhalten:

ie6double

Wo n am linken Rand unserer 100px ist! si trova a diretto contatto con il suo contenitore. Dieser Defekt, zum Glück, tritt nur unter bestimmten Umständen, dh wenn die Marge mit der Richtung des zusammenfällt float und wenn unsere div#box steht in direktem Kontakt mit seinem Behälter. precedente. Dies bedeutet, dass eine zusätzliche div#box auf der gleichen Linie nicht leiden, weil das Problem auf der linken Seite, nicht aber die Container div#box oben. Offensichtlich ist das Problem nicht spezifisch an den linken Rand, aber es spiegelnde Umkehrung der ganzen Sache würde das gleiche Problem mit dem rechten Rand zu haben!

Lösung

Die Lösung ist denkbar einfach: Legen Sie einfach die Erklärung display:inline in unserem CSS, und der Mangel verschwindet:

1
2
display : block ; width : 100px ; height : 100px ; margin-left : 100px ; float : left ; div # box {display: block; width: 100px; height: 100px; margin-left: 100px; float: left;
inline } display: inline}

Die Einführung von display:inline wird von allen anderen Browsern ignoriert werden, und nicht weil wir besonders glücklich, sondern durch spezifisch sind W3C :

... Der 'display' wird ignoriert, die, wenn sie den Wert 'none' hat.

6 Kommentare zu "Internet Explorer 6: Beseitigung der doppelten Marge bug"

  1. 16. Dezember 2008 Mauritius :

    Ich verstand nicht, nur eins:
    in der Klassendefinition muss sowohl auf dem Display zu präsentieren: Block display: inline. ?
    so dass nur noch der zweite den gleichen Defekt hat?

    Dank

  2. 16. Dezember 2008 Giovambattista Fazioli :

    @ Mauritius:

    Ich verstand nicht, nur eins:
    in der Klassendefinition muss sowohl auf dem Display zu präsentieren: Block display: inline. ?
    so dass nur noch die zweite hat den gleichen Fehler? dank

    Das display:block Sie es mit ersetzen kann display:inline

  3. 16. Dezember 2008 Francis Gaven :

    Ich erinnere mich, das war einer der ersten Fehler, auf die ich mit IE6 konfrontiert wurde.
    Zumindest in diesem Fall ist die Lösung mindestens gleich (vorausgesetzt, dass Sie wissen, : P )

  4. 9. Januar 2009 DigitaLife »IE6: Double Margin Lösung Tipps & GUI :

    [...] Wir haben einfach erklärt, wie man das Problem der doppelten Marge im IE6, der Fluch der Web beseitigen [...]

  5. 18. Dezember 2009 Fabio:

    Sind Sie ein großer, würdest du tun, ein Denkmal! Klar, einfach und schnell! Großen Beitrag

  6. 15. Januar 2010 Ivan Davis:

    Du bist ein großer! es funktioniert super. jetzt meine Tasten sind nur einmal gesehen. Der Befehl "display: inline" behandelt eine Vielzahl von Problemen in IE.

Hinterlasse einen Kommentar

XHTML TAG PERMIT: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERTION CODE:
 <pre></pre> // blocco generico <code></code> // blocco generico [cc_actionscript][/cc_actionscript] // Actionscript [cc_actionscript3][/cc_actionscript3] // Actionscript 3 [cc_css][/cc_css] // CSS Style Sheet [cc_html][/cc_html] // HTML [cc_js][/cc_js] // Javascript [cc_objc][/cc_objc] // Objective-C [cc_php][/cc_objc] // PHP [cc_sql][/cc_sql] // SQL