Http://blog.sina.com.cn/s/blog_68c6be330101k7kn.html
We often use div+css layout of the page, normally need to center the Div display, the use of CSS style: margin:0 auto is OK, but sometimes use margin:0 auto in the Firefox browser, Google Chrome browser can be centered, But in the IE678 but cannot but center.
For example, the following code:
<style type= "Text/css" >
#con {width:980px;martin:0 Auto;}
</style>
<div id= "con" > Test margin:0 Auto content is centered </div>
So what do we do? There are three effective ways to solve the tutorial network:
Workaround One
Because all HTML pages are initially defined in a DTD document, this behavior occurs because the DTD declaration of the document should modify the DTD to
<! DOCTYPE HTML PUBLIC "-//w3c//dtd XHTML 1.0transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Workaround Two
Can be centered on page body <body> declaration text, i.e. Body{text-align:center}
That
<style type= "Text/css" >
Body{text-align:center}
#con {width:980px;martin:0 Auto;}
</style>
<div id= "con" > Test margin:0 Auto content is centered </div>
Workaround Three
In fact, the same as the solution, just to center the DIV layer to add more than one div, and make it centered
That
<style type= "Text/css" >
#con {width:980px;martin:0 Auto;}
</style>
<divstyle= "Text-align:center" ><divid= "con" > Test margin:0 Auto content is centered </div></div>
Why is margin:0 auto not centered under IE?