IE6–IE8中margin:0 auto不居中，首要原因是DOCTYPE缺失或格式错误导致浏览器进入怪异模式，必须顶格书写<!DOCTYPE html>且无BOM、空格或注释；其次需确保元素有明确width、非浮动、非绝对定位，并避免在body上直接使用该样式，应包裹容器并设宽居中。
IE6–IE8中margin: 0 auto不居中，先看DOCTYPE是否顶格
IE6–IE8在怪异模式下会把margin: 0 auto当普通外边距处理，根本不会触发居中逻辑。这不是CSS写错了，而是浏览器压根没进标准模式。
必须确保 HTML 文件开头第一行就是：
<!DOCTYPE html>且前面**不能有任何字符**（包括空格、BOM、注释）。哪怕一个看不见的UTF-8 BOM字节，IE都会退回到怪异模式。
- 用编辑器检查文件编码，保存为“UTF-8 无BOM”格式
- 删掉
<!DOCTYPE>前所有空行、<!-- -->注释、<meta>或<script> - 不要用
<!DOCTYPE html PUBLIC ...>这种XHTML写法——IE8及以下对它解析不稳定
IE8及以下不支持display: flex，别硬套现代写法
给父容器写display: flex; justify-content: center; align-items: center在IE10+才有效，IE8会直接忽略整条规则，子元素照常左上角堆叠。
如果必须兼容 IE8，就放弃 Flex，改用以下任一方案：
立即学习“前端免费学习笔记（深入）”；
-
text-align: center+display: inline-block：父设text-align: center，子设display: inline-block; vertical-align: middle（注意子元素不能是float或position: absolute） -
position: relative+left: 50%+margin-left: -[半宽]：需知道子元素固定宽度，比如width: 960px→margin-left: -480px -
<center></center>标签：虽然过时但IE全版本都认，只是它会让内部所有文本、按钮、图片都居中，得额外重置子元素的text-align
IE7及以下对body上设margin: 0 auto无效，要套一层容器
直接给<body>加margin: 0 auto在IE7及以下基本不起作用，因为body默认宽度是100%，auto左右边距没有计算基准。
正确做法是包一层<div id="wrapper">，再给它设宽和居中：
.wrapper {<br> width: 960px;<br> margin: 0 auto;<br>}同时确保这个div是<body>的**第一个子元素**，中间不能插<script>或<style>——IE7会把非元素节点算进子元素计数，导致margin: 0 auto失效。
IE6特有的双倍浮动margin和文本继承问题
IE6对浮动元素的margin会加倍渲染（比如margin-left: 20px变成40px），而text-align: center又会从<body>一路继承到所有块级子元素，造成意外居中。
- 浮动元素加
display: inline可修复双倍margin（不是inline-block） - 如果用了
text-align: center做居中，记得给不需要居中的子元素显式重置：text-align: left - IE6不识别
min-width，若容器宽度随视口变化，优先用width固定值 +margin: 0 auto，别依赖响应式逻辑
真正卡住人的从来不是“怎么居中”，而是你不知道IE在哪个环节悄悄切了渲染模式——先验DOCTYPE，再查元素是否脱离流，最后才轮到CSS本身。
