CSS - 改变总宽度答案

【问题标题】：CSS - Changing total widthCSS - 改变总宽度
【发布时间】：2010-12-24 07:54:53
【问题描述】：

我有一个比屏幕宽度更宽的 Blogger 模板，它会显示水平滚动条。我想更改它以使其适合并且不显示滚动条。但问题是我不知道是什么原因造成的。我已经下载了模板文件并在我的代码编辑器中查找了所有 width 属性并将所有 100%s 更改为 90% 并将像素宽度值更改为 value-100，但页面仍然和以前一样.

在这种情况下找到有效的规则/规则时，我还应该寻找/做什么？检查事物以找到规则的综合程序是什么？

【问题讨论】：

能否提供博客或模板的链接？另外，你运行这个的屏幕宽度是多少？
如果一个 div 的宽度为 100%，但其中的一段内容（图像或没有空格的文本单词）像素较宽，则内容将流出 div 并导致一个水平滚动条。如果您将 100% 更改为 90%，同样的事情也会发生。给你的主 div 一个背景颜色，看看颜色是否也延伸到视口之外。或者在这里添加一些代码，以便我们查看。

标签： css blogger

【解决方案1】：

不要更改宽度，而是尝试将 CSS 属性 overflow: hidden 添加到您认为可能导致问题的所有内容中，然后将它们一一删除，直到滚动条重新出现，您将找到罪魁祸首。您可能还需要将其添加到html 和body。如果滚动条没有显示任何实际内容，您可以留下overflow: hidden 来解决问题。

【讨论】：

【解决方案2】：

这可能不是导致问题的宽度属性 - 如果容器的宽度是使用定义的百分比。

使用固定宽度定义根容器，这样可以消除许多此类问题。请先尝试一下，然后告诉我们它是否有效。

【讨论】：

【解决方案3】：

程序：

1)。了解the box model 以及它在 IE 上的变化。 “宽度”问题实际上可能是由填充、边距甚至边框引起的，就像宽度一样。

2)。检查其他浏览器中的渲染。如果您可以在 FF 中重现该问题，请获取 Firebug 并使用它来找出相关元素的计算尺寸，并通过可能导致问题的子元素向下隧道。 Chrome 有一个与 Firebug iirc 类似的调试器，但我不熟悉它。

3)。如果这不能告诉您问题是什么，请开始从您的 CSS 中删除规则或整个模式，直到问题消失（或删除所有内容并零碎添加，直到问题再次出现）-此时您知道是什么原因造成的问题，如果不是为什么，您可以随时更新问题，在您发现问题后询问我们为什么。

第

（Apols，如果其中任何一个已经很明显）

【讨论】：

【解决方案4】：

嗯，% 总是以“100”开头。看到body标签的宽度百分比设置为100%。然后根据它，只需根据您的显示要求设置其他组件％。

我个人认为，使用 % 比使用 'px' 更好。如果您了解 CSS，请尝试根据要求将 'px' 更改为 %。

【讨论】：

【解决方案5】：

该组件似乎具有min-width 样式和overflow property 设置为auto。您可能希望将其设置为 visible 并首先在 ~~FireBug~~ Firefox Page Inspector 中进行操作，以便在进行后期编辑之前查看效果。如果您只想调整整个帖子的宽度，blogger has standard interface。你也可以edit the template manually

【讨论】：