Html 如何将包装器 div 居中而不是内容居中
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8701054/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to center a wrapper-div and not the content
提问by ohmyzZz
I want my page to always be centered in the browser without affecting the content( like align-text: center; does). I want to center my wrapper-div.. How do I do this?
我希望我的页面始终在浏览器中居中而不影响内容（例如 align-text: center; 确实如此）。我想将我的包装器 div 居中。我该怎么做？
Simplifed existing page:
简化现有页面：
<div id="wrapper">
<div id="header">
Music Heaven
</div>
<div id="topmeny">
</div>
<div id="menu">
</div>
<div id="content">
</div>
<div id="bottom">
SiteAdmin
</div>
</div>
Entire fiddle: http://jsfiddle.net/EndQb/
整个小提琴：http: //jsfiddle.net/EndQb/
回答by Fabrizio Calderan
#wrapper {
width: ...
margin: 0 auto;
}
no need to set text-align
无需设置文本对齐
回答by samir chauhan
Set your style something like for the wrapper div.
为包装器 div 设置类似的样式。
#wrapper {
width: 841px;
margin: 0 auto;
}
}
In this way the wrapper div will always be centered according to your screen width. I hope it helps.
这样，包装器 div 将始终根据您的屏幕宽度居中。我希望它有帮助。
回答by Pankaj Upadhyay
you can set the margin property for the wrapper div like following in CSS
您可以在 CSS 中为包装 div 设置边距属性，如下所示
#wrapper { margin:20px auto }
