好吧，长话短说，我的一个客户让我做一个元素，他特别想要的设计要求 100% 宽度的标题包装器，包含 Logo 的内部 div 宽度为 1300 像素。
问题是，例如，在我的 23 in 屏幕上，它很好，显示了它应该如何，但在较小的屏幕上，有一个巨大的差距，包装 div 的内部 div 都没有对齐。
例如，假设我们有两个 div，内部 div 是红色的，外部 div 是深蓝色的，背景是绿色的，在大屏幕上，我明白了(这就是我想要的)
-------------------------------------------------------------------
| -----------------------------------| |
| | | end Of window->|
| |red centered in the middle(1300px wide) green **not** seen|
| ----------------------------------- |
| wrapper header div @ 100% (DARKBLUE) |
| ------------------------------------------------------------------
现在，在上面的例子中，在标题上，你看不到绿色，因为标题包装器 div为100%
现在在较小的屏幕上，例如 my13'mac/iphone/sammy 平板电脑
我明白了
------------------------------------------------------------------------------|
-----------------------------------| | |
| | | endOf parent header div |
| red | | <--pushed all the way left |
----------------------------------- | |
wrapper header div @ 100% (DARKBLUE) | GREEN |
------------------------------------------------------------------------------|
所以我想说明的是，在较小的屏幕上，中心 div 一直向左推，并显示绿色....
关于为什么的任何想法？再次在所有大屏幕上都很好，在较小的屏幕上，它坏了...
我应用到这些的 css 非常简单。
RED div 是:
#topRow{
width:100%;
height:120px;
background-image:url(../../images/menuStripBg.png);
background-repeat:repeat-x;
}
内部 div (DARKBLUE) 是:
#topRowInner{
min-width:1300px;
margin:0px auto;
}
现在我假设问题是，在较小的屏幕上，由于宽度 内部(深蓝色)div 是 1300px；较小的屏幕分辨率是 小于 1300，屏幕在 100% 时会丢失，本质上，它不能居中 如果父包装器 100% 小于 1300，则为 1300......
不确定这是否有意义......
无论如何，如果这是问题所在，知道如何解决这个问题吗？
如果这不是问题，那么我很乐意提供任何提示/提示等。
提前致谢。
最佳答案
假设您使用 ascii-example 并忽略对您问题的进一步描述，我认为您正在搜索类似 this solution 的内容(扩大和缩小窗口)。
您还可以将 topRowInner div 中的 position、left 和 margin-left 样式替换为 margin: 0 auto; 就像在您自己的 css 中一样，但是当窗口小于 1300 像素时，它不会居中。
关于html - 百分比宽度和固定内宽问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10067289/