隔离测试用例（在 IE 7 或 IE 8/9 中查看 IE 7 模式）
在 IE 7 中查看此页面会导致我的宽度值被忽略。如果您删除 padding 值，宽度会被正确应用，但是当您添加 padding 时，它会导致整个页面增长，并且它会将 padding 几乎视为边距。页面宽度越大，元素右侧的空白区域越大。我一直无法找到这是哪个错误，更重要的是，如何修复它。有没有人看到这个，有没有人知道解决方案？
到目前为止我尝试过的事情：
zoom使固定display: inline-block（推荐用于双垂直填充问题）line-height（这是宽度问题...）问题截图：
这个 div 应该跨越页面的整个宽度，仅此而已，但您会注意到这里的滚动条：
以及向右滚动的结果：
这不应该存在。
检查浏览器工具中的元素显示宽度错误地是页面的全宽，而不是全宽减去填充。
免责声明：我将忽略功能要求和您对其他答案的评论，而只专注于具体问题。
此 IE7 特定问题是由在相对定位的元素上使用偏移量（例如 、 或top）right引起的。如果你偏移一个相对定位的元素，那么它基本上仍然会保留其原始位置的整个空间。请注意，偏移绝对定位元素时不会发生这种情况。bottomleft
在left应用偏移之前，相对定位的元素是由于它的宽度和右边的填充完全超出了视口，因此将生成一个水平的 scollbar。在left相对定位的元素上应用偏移后，您基本上会在偏移的另一侧留下与偏移大小相同的空间，仍在视口之外。
在重绘期间有点理智的网络浏览器会发现在视口之外没有任何可见的东西，因此再次隐藏滚动条。然而，IE7 不够智能，并且保留了滚动条。
毕竟，使用left偏移在技术上是错误的解决方案。您首先应该使用margin-left而不是left. 与偏移不同的是，margin 不会在原始位置上留下空白空间，而是真正将整个元素推到所需位置。
所以，这里是你的脚本是如何被修复的：
$('#el').css({
'width': document.body.scrollWidth - 200,
'padding-right': 200,
'margin-left': (-1 * (document.body.scrollWidth - 322) / 2) - 1
});
顺便说一句，我想知道这float: left;在你显然想要模拟 100% 宽度的构造中有何意义。它可能用于具体示例中不可见的其他目的。
您可以在不使用 javascript 计算宽度且没有填充的情况下解决此问题，而是使用position: absolute. 这是一个更新的小提琴。它适用于任何浏览器
#el {
background-color: #FFFF00;
min-height: 45px;
width: 100%;
position: absolute;
left:0;
right: 0;
top: 0;
}
我在skeleton.css 实现中遇到了这个问题。具体来说，我#header的宽度为body，宽度为html。其余内容的设置宽度为 978px。所以当窗口小于 978 时，标题的背景只会渲染到视口的宽度。即 - 如果您以 500 宽开始渲染，那就更宽了#header。拖动更宽的视口没有问题，但右滚动会将标题剪切到初始视口的大小。
我的修复：html,body { min-width:978px } /* your width may vary */
修复了原始帖子，因为它偏离了数英里。
编辑：
在沙盒 IE7 中测试，它可以工作。（我能说什么，我不遗余力地得到完美的东西，这里也是新人，所以赏金真的很有帮助）还要注意它在 IE7、IE8 和 IE9、FF3.6 中原生工作, Opera 10 并且应该可以在 Safari 中正常运行，Chrome 没有被提及，因为它是我的默认浏览器并且它可以运行，毫无疑问。
这是JS：
function resize () {
$('#el').trigger('resize').width('100%');
}
resize();
和CSS：
#container {
width: 320px;
border: 1px solid #000000;
min-height: 500px;
margin: 0px auto;
}
#el {
background-color: #FFFF00;
min-height: 45px;
width: 100%;
position: absolute;
left: 0;
}
由于您似乎可以使用 Javascript，因此请调整您的resize()功能：
function resize () {
$('#el').css({'width':$(window).width(),'position':'absolute','left':'0px'});
}
我在这里找到了类似问题的解决方案。看看它是否也能帮助你。