Html 风格不同于铬合金，即居中_Html_Css_Internet Explorer

Html 风格不同于铬合金，即居中

html css internet-explorer

Html 风格不同于铬合金，即居中,html,css,internet-explorer,Html,Css,Internet Explorer,我正在尝试将页面居中。页面以chrome和FF居中显示。把所有东西都推到左边。我感到困惑的是，我对多个页面使用了一个样式表，其中有几个页面在所有浏览器中都是正确的。最好的猜测是我在页面上设置的样式生成了不正确的格式唯一有效的解决方案是，如果我应用文本对齐：居中，但这不可行，因为它们的正文中已经有其他几种文本样式我试过了将边距从 margin:0 到 margin:10px自动0 和 .container{width:auto；}更改为.container{width:900px；} 我在这

我正在尝试将页面居中。页面以chrome和FF居中显示。把所有东西都推到左边。我感到困惑的是，我对多个页面使用了一个样式表，其中有几个页面在所有浏览器中都是正确的。最好的猜测是我在页面上设置的样式生成了不正确的格式

唯一有效的解决方案是，如果我应用

文本对齐：居中

，但这不可行，因为它们的正文中已经有其他几种文本样式

我试过了将边距从

margin:0

到

margin:10px自动0
和
.container{width:auto；}
更改为.container{width:900px；}

我在这里附加了一个JSFIDLE，尽管我不确定它是否有助于识别问题，因为它看起来是集中的
目前的问题就在这里。
当我发现问题时，我会更新小提琴以显示问题和解决方案。
所以问题是：
#wrapper { width:100%; overflow:hidden; margin-left:auto; margin-right:auto; }

/* Wrapper Sub Elements */
.w-main { width:1004px; margin:0 auto; overflow:hidden; }

基本上，您正在创建一个与当前窗口宽度相同的“包装器”。然后创建一个子元素，该元素具有设置的宽度1004px
，具有自动左/右边距
之所以会撞到窗口的最左边，是因为#wrapper
元素的文本向左对齐
你应该做的事情很简单，比如：
#wrapper { width:100%; overflow:hidden; margin-left:auto; margin-right:auto; 
        text-align:center; } // <-- that 

/* Wrapper Sub Elements */
.w-main { width:1004px; margin:0 auto; overflow:hidden; 
         text-align:left;} // <----and this

#包装{宽度：100%；溢出：隐藏；左边距：自动；右边距：自动；
文本对齐：居中；}/您处于怪癖模式。将您的doctype更改为
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">



或


无需对准中心。这也将解决您在IE中的许多其他问题。感谢您的快速响应。我没有注意到这一点！非常感谢您现在尝试修复，并将提供详细信息。完美修复！继续下一个问题！谢谢
  <!DOCTYPE HTML>