首頁 > web前端 > css教學 > 為什麼「margin: 0 auto」在 IE8 標準模式下以不同的方式居中元素?

為什麼「margin: 0 auto」在 IE8 標準模式下以不同的方式居中元素?

DDD
發布: 2024-12-05 03:35:11
原創
453 人瀏覽過

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

了解Internet Explorer 8 中的Margin: 0 Auto 行為

Internet Explorer 8 中的margin: 0 auto 屬性的行為可以是令人困惑,尤其是與其他瀏覽器中的處理相比。為了解決這些差異,本文研究了特定於瀏覽器的行為並提供了相關規範的參考。

在使用 margin: 0 auto 的居中按鈕的特定情況下,IE8 中的行為與其他瀏覽器不同。以下程式碼示範了這一點:

HTML:

<div>
登入後複製

在Firefox、Opera、Safari、Chrome、IE7 和IE8 相容模式下,按鈕居中,而在IE8 標準模式下,事實並非如此。

要解決這種不一致問題,建議向HTML 文件添加DOCTYPE,如下所示如下:

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

使用此DOCTYPE,IE8 標準模式也將使用margin: 0 auto 正確居中按鈕。

關於提出的具體問題:

  1. 顯示:區塊和元素寬度:

      根據C🎜>
    • 根據CC2.1規範,設定「display: block」並沒有定義元素的具體寬度。
    • 但是,大多數瀏覽器都會解釋「 display: block」將寬度設為 100% 或可用寬度。規範不保證此行為。
  2. 邊距:0 auto 和元素對齊:

    • 當「顯示」時: block」被設定, 「margin: 0 auto」的解釋不同瀏覽器。標準模式不支援輸入按鈕等內聯元素的「margin: 0 auto」。 >

以上是為什麼「margin: 0 auto」在 IE8 標準模式下以不同的方式居中元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板