margin:0px auto在IE中无效的正解——DOCTYPE

今天做个页面,想居中,代码简化如下:

<body>
<div style=”width:1003px; margin:0px auto;”>

</div>
</body>

在Firefox和Opera中均能正确居中,而IE却始终居左,先前做网页都用同样的方法,却只有这次不行。

由于实际代码比较复杂,怕是其他代码干扰所致,干脆全部注释掉了再看——终究还是不行。看了看自己以前所做页面的源代码,也看不出个所以然来 ,只好上网搜索。

有的说这个CSS是兼容浏览器的写法,也有说这个CSS在IE中不起作用的。

说兼容,我这次明明是写了一样的代码却不成;说不起作用,以前都这样写的却能正确显示。

终于找到了一篇文章让我找出了问题的根本,该文作者提到CSS 兼容要点:DOCTYPE 影响 CSS 处理

我再比较了代码,确实这次没有在<html>标签之前加上<!–DOCTYPE … –> ,于是把以前的文件中的复制了过来。再保存、刷新。果然就能正确显示了。到此终于弄明白了margin:0px auto;在IE中无效的真正原因。

对于前面提到的两种说法,原来都可以说是正确的,只是没有说清楚前提,或者作者根本没意识到有这么个前提 ……其实细想之下,出现这种情况也在情理之中,DOCTYPE中可供选择的规范有很多,但很少有人去关心这些规范之间的差别,很多网页制作工具都能自动生成这一行,就算用文本编辑器写页面的人,也不至于把这些规范的写法都背下了,总是要的时候去以前的代码,或者随便打开个网页,把头几行内容都复制过来,慢慢再改。再加上现在的浏览器的超强容错性,大家就不去在意这些了……

This entry was posted in 页面设计. Bookmark the permalink.

2 Responses to margin:0px auto在IE中无效的正解——DOCTYPE

  1. chenchen says:

    用dw,默认生成文档声明。。

  2. bnlt says:

    @chenchen
    所以说用普通文本编辑器的时候容易忘记写这一行

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">