Heim >Web-Frontend >CSS-Tutorial >Warum zentriert „margin: 0 auto' Elemente im IE8-Standardmodus unterschiedlich?

Warum zentriert „margin: 0 auto' Elemente im IE8-Standardmodus unterschiedlich?

DDD
DDDOriginal
2024-12-05 03:35:11435Durchsuche

Why Does `margin: 0 auto` Center Elements Differently in IE8 Standard Mode?

Verstehen des Margin: 0 Auto-Verhaltens in Internet Explorer 8

Das Verhalten der Margin: 0 Auto-Eigenschaft in Internet Explorer 8 kann sein verwirrend, insbesondere im Vergleich zur Handhabung in anderen Browsern. Um diese Diskrepanzen zu beheben, untersucht dieser Artikel das browserspezifische Verhalten und stellt Verweise auf die relevanten Spezifikationen bereit.

Im speziellen Fall einer zentrierten Schaltfläche mit margin: 0 auto unterscheidet sich das Verhalten in IE8 von anderen Browsern. Der folgende Code demonstriert dies:

HTML:

<div>

Im Firefox-, Opera-, Safari-, Chrome-, IE7- und IE8-Kompatibilitätsmodus ist die Schaltfläche zentriert, während im IE8-Standardmodus Dies ist nicht der Fall.

Um diese Inkonsistenz zu beheben, wird empfohlen, wie gezeigt einen DOCTYPE zum HTML-Dokument hinzuzufügen unten:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Mit diesem DOCTYPE zentriert der IE8-Standardmodus die Schaltfläche auch korrekt mithilfe von margin: 0 auto.

Zu den spezifischen Fragen, die aufgeworfen werden:

  1. Anzeige: Block und Element Breite:

    • Gemäß der CSS2.1-Spezifikation definiert die Einstellung „display: block“ keine bestimmte Breite für das Element.
    • Die meisten Browser interpretieren jedoch „ display:block“, um die Breite auf 100 % oder die verfügbare Breite festzulegen. Dieses Verhalten wird durch die Spezifikation nicht garantiert.
  2. Rand: 0 automatisch und Elementausrichtung:

    • Wenn „display : block“ gesetzt ist, wird „margin: 0 auto“ von Browsern unterschiedlich interpretiert.
    • Der IE8-Standardmodus wird nicht berücksichtigt „margin: 0 auto“ für Elemente auf Inline-Ebene wie Eingabeschaltflächen. Dies widerspricht der CSS2.1-Spezifikation, die besagt, dass „margin: 0 auto“ Elemente auf Blockebene zentrieren soll.

Das obige ist der detaillierte Inhalt vonWarum zentriert „margin: 0 auto' Elemente im IE8-Standardmodus unterschiedlich?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn