相关问题不包含有用的答案。
我正在尝试为宽度为 2000 像素(宽度足以覆盖大多数大屏幕)但居中的网站创建标题栏，但我也不想要父容器 div(它是定位在左侧 50%)，导致浏览器水平溢出。
我不能只是在 html 或 body 标签上“ overflow hidden ”，因为我没有声明特定的宽度(并且声明 100% 不会 overflow hidden )。
我的代码是这样的:
<body>
<div id="navbgout">
<div id="navbg"></div>
</div>
#navbgout {
width:2000px;
height:60px;
position:relative;
left:50%;
}
#navbg {
width:2000px;
height:80px;
position:relative;
left:-50%;
background-image:url("images/header_bg.png");
}
我尝试在其周围放置另一个父容器以提供溢出:隐藏，但没有任何效果。如果我将该父级设置为 100% 宽度，则它不会屏蔽。如果我将它设置为以像素为单位的固定值，则它不会反射大小。
这特别令人烦恼，因为 iPad 的移动 Safari 会将这个“溢出”宽度读取为真实宽度，并将页面缩小得更远以解决它。
最佳答案
您无需将宽度声明为 2000 像素即可适应屏幕尺寸。如果您将宽度设置为 100%，那么它将始终调整为视口(viewport)的宽度。
理想情况下，您可以将宽度设置为 100%，然后添加一个容器类，例如max-width: 1200px; 和 margin: 0 auto; 这将使导航栏始终是视口(viewport)的宽度，但也允许内容在屏幕上居中。
关于html - 在没有水平滚动的情况下，使 HTML 内容居中比浏览器更宽？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23067967/