使用margin:0 auto页面居中在IE中的问题

首先说说页面居中的实现方式，排除IE5.5，可以使用下面的方法

body{width:1002px; margin:0 auto;}//页面居中

或者这样：

.Header,.Main,.Footer{clear:both; width:1002px; margin:0 auto;}//页面居中

两种方法在效果上是一样的，但是今天遇到了这样一个问题：

1. 我使用第一种方法让页面居中；
2. 调试环境为Internet Explorer 6.0 (6.00.2900.5512) (32-bit);
3. 在新闻列表页单击某一条新闻，在新窗口打开，显示正常；
4. 但IE6默认的打开方式不是窗口最大化，然后再去单击“最大化”按钮；
5. 奇迹出现了“.Header”和“.Footer”跑到左边去了，而“.Main”还在中间，经过简单测试，得出的结论是body元素没有居中，因为“.Main”里面做了相对定位的元素也移到了相对body的位置，而不是“.Main”（不知道这样理解对不对）；
6. 当经过不定时的时间或者鼠标移动到“.Header”上到时候，页面立即恢复正常；

截图：

可以看到页头部分的变化，下面看页尾的变化：

    红色线表示的是页面的左边的正确位置，看得出“.Header”和“.Footer”都超出了这条线。既然是IE6的问题，不会IE7也有问题吧（因为这个问题在IETester下没办法测试，因为IETester会自动最大化窗口，效果一闪就过去了），结果是IE7更厉害，不但“飞”得跟IE6一样，而且比IE6还顽固，鼠标移上去都不恢复，非要选择文本才能恢复；再去试试IE8吧，幸好IE8没有让人感觉到“飞”的感觉，但是仍旧看到了页面最大化后，有从左边飞到居中的位置的痕迹，难不成IE8不但没有解决这个问题，还把它做成了动画？？这个就需要高人慢慢的研究了。

    因为样式写了很多，还没有来得及分离，不排除是自身样式冲突造成的。

 

虽然至此位置还是没弄明白具体原因，但是至少有解决方法：

第一种：使用文章开始说的第二种居中的方法，即

.Header,.Main,.Footer{clear:both; width:1002px; margin:0 auto;}//页面居中

可以避免这种错误，为什么我也不知道。

第二种：只是一种思路，考虑有可能是IE的Layout造成的，但是至今没找到解决办法。