我正在尝试将页面居中。该页面以 chrome 和 FF 居中显示。 IE 把所有东西都推到左边。我感到困惑的地方是我对多个页面使用 1 个样式表,而其中几个页面在所有浏览器中都是正确的。最好的猜测是我在页面上设置的样式生成了不正确的格式。
唯一可行的解决方案是如果我应用 text align: center
但这是不可行的,因为它们已经在正文中显示了其他几种文本样式。
我试过了
从更改边距
边距:0
到
边距:10px auto 0;
和
.container{width:auto;}
通过将其更改为 .container{width:900px;}
来固定宽度
我在这里附加了一个 jsfiddle,但我不确定它是否有助于确定问题,因为它看起来居中。 http://jsfiddle.net/thetylercox/p6ENV/
目前的问题就在这里。 http://www.redwirelogic.com/index.html 当我发现问题时,我会更新 fiddle 以显示问题和解决方案。
最佳答案
问题来了:
#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
关于html - 风格从 chrome 到 IE 不同。定心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14653553/