Mengapa `margin: 0 auto` Pusat Elemen Berbeza dalam Mod Standard IE8?-tutorial css-php.cn

Mengapa `margin: 0 auto` Pusat Elemen Berbeza dalam Mod Standard IE8?

DDD

Lepaskan： 2024-12-05 03:35:11

asal

452 orang telah melayarinya

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

Memahami Margin: 0 Auto Behaviour dalam Internet Explorer 8

Gelagat margin: 0 auto property dalam Internet Explorer 8 boleh mengelirukan, terutamanya jika dibandingkan dengan pengendaliannya dalam pelayar lain. Untuk menangani percanggahan ini, artikel ini mengkaji gelagat khusus penyemak imbas dan menyediakan rujukan kepada spesifikasi yang berkaitan.

Dalam kes tertentu butang berpusat menggunakan margin: 0 auto, gelagat dalam IE8 berbeza daripada penyemak imbas lain. Kod berikut menunjukkan perkara ini:

HTML:

<div>

Salin selepas log masuk

Dalam mod keserasian Firefox, Opera, Safari, Chrome, IE7 dan IE8, butang berada di tengah, manakala dalam mod standard IE8, ia tidak.

Untuk menyelesaikan ketidakkonsistenan ini, adalah disyorkan untuk menambah DOCTYPE pada dokumen HTML, seperti yang ditunjukkan di bawah:

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

Salin selepas log masuk

Dengan DOCTYPE ini, mod standard IE8 juga akan memusatkan butang dengan betul menggunakan margin: 0 auto.

Mengenai soalan khusus yang dibangkitkan:

Paparan: blok dan Elemen Lebar:
- Menurut spesifikasi CSS2.1, tetapan "display: block" tidak mentakrifkan lebar khusus untuk elemen.
- Walau bagaimanapun, kebanyakan penyemak imbas mentafsir " display: block" untuk menetapkan lebar kepada 100% atau lebar yang tersedia. Tingkah laku ini tidak dijamin oleh spesifikasi.
Margin: 0 auto dan Penjajaran Elemen:
- Apabila "paparan : block" ditetapkan, "margin: 0 auto" ditafsir secara berbeza oleh penyemak imbas.
- Mod standard IE8 tidak menghormati "margin: 0 auto" untuk elemen peringkat sebaris seperti butang input. Ini bercanggah dengan spesifikasi CSS2.1, yang menyatakan bahawa "margin: 0 auto" harus memusatkan elemen peringkat blok.

Atas ialah kandungan terperinci Mengapa `margin: 0 auto` Pusat Elemen Berbeza dalam Mod Standard IE8?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!