使用窄浏览器时 CSS 块无法缩放到 100%答案

【问题标题】：CSS block doesn't scale to 100% with narrow browser使用窄浏览器时 CSS 块无法缩放到 100%
【发布时间】：2011-10-19 03:07:23
【问题描述】：

我有一个问题 - 当我的浏览器小于 100% 的页面宽度（又名 960 像素）时，容器块不会 100% 缩放。

图片：http://www.upload.ee/image/1549682/problem.png

   /* CONTENT */
div#content {
width:100%;
background-color: #e0e3e3;
}

div#content_wrap {
display: block;
width: 960px;
min-height:200px;
margin: 0 auto 0 auto;
}


<div id="content">
    <div id="content_wrap">
        test
    </div>
</div>

【问题讨论】：

您在哪个浏览器中遇到问题？它似乎在 chrome 中运行良好。

标签： html css browser width scale

【解决方案1】：

将其添加到您的风格中

body{
        margin:0;
        padding:0;
    }

【讨论】：

这似乎根本无法解决问题：jsfiddle.net/bwcSs 您仍然可以滚动到一边查看空白区域。
@hughes 复制完整代码添加粘贴到记事本然后检查
哪个浏览器？窄而烦人的广告显示？为什么要在 style.css 中向 body 添加 10px 的填充然后将其删除？这么多问题......我正在使用 Chrome，这个解决方案有效。

【解决方案2】：

将width: 100% 更改为display: inline-block。

div#content {
    display: inline-block;
    background-color: #e0e3e3;
}

问题在于width: 100% 将宽度设置为 父元素 的 100%，而不是子元素的大小。要使 div 适合内容，请使用 inline-block 。

【讨论】：

以某种方式取消了边距，页面不再居中，背景颜色只影响子元素，但我希望它是全角的。
Display:inline-block + width 100% 成功了，感谢您的帮助。