Question

我完全是CSS布局的初学者，但我试图刚刚开始一个基本的“固定宽度”中心列（只有一个div），这样两边都很灵活。我知道这不是响应/反应，但我刚刚开始。

所以我尝试了大量的例子，但我找不到适用于FF和IE9的起点？我的意思是刚开始，他们是不同的??

以下是我尝试的简单风格的最新示例：

* { padding: 0; margin: 0; }

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
 background: #f5f5f5;
}
#wrapper { 
 margin: 0 auto;
 width: 922px;
}
#content { 
 width: 900px;
 color: #333;
 border: 0px solid #f5f5f5;
 background: white;
 margin: 0px 0px 0px 0px;
 padding: 10px;
 height: 600px;
}

所以这是一个开始，但已经FF显示这与中心对齐而IE没有。所以我尝试的所有内容（即左边：50％和边距右边：-461px，我发现的例子）对这些影响不同。我在这里读到这是一个非常普遍的挑战，但我担心这里有一些我不知道的基础逻辑？

非常感谢任何帮助！

编辑：感谢您的评论！我有以下，它再次在IE（和铬）但但不是FF吗？

的CSS：

* { padding: 0; margin: 0; }

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
 background: #f5f5f5;
}
#wrapper { 
 margin: 0 auto;
 width: 922px;
 margin-left:auto;
 margin-right:auto;

}
#content { 
 width: 900px;
 color: #333;
 border: 2px solid #f5f5f5;
 background: white;
 padding: 10px;
 height: 600px;
 position:absolute;
 left:50%;
 margin-left:-461px;
}

#welcomeBanner{
    text-align:center;
    font-family:"segoe ui light","segoe ui","segoe";
    font-size:18pt;
    padding-top:20px;
    padding-bottom:20px;
    margin-top:0px;
}

html：只是字面意思：

    <div id="wrapper">
        <div id="content">
            <div id="welcomeBanner">Attempting to Learn This Stuff<div>
        </div>
    </div>

所以在IE9和Chrome中我得到了中心的标题，大框中心用背景颜色等固定。在FF中没什么。我喜欢没有应用于页面的样式？我在头部使用了一个链接标签，但它显然存在并为其他人工作？

Answer 1

body {
    width:100%
}

div {
    width: 900px;
    margin:0 auto;
}

应该有效

cf Centering a Div in IE9 Using margin:auto

在FF和IE9中工作的CSS中心列？

1 个答案: