css - CSS：带有文本的液体条不会展开

Question

我有一个单杠，它被赋予width了100%. 在水平栏中，我有一个在978px容器内左对齐的文本。每当浏览器窗口缩小到小于978px宽度时，页面底部就会出现一个滚动条。每当我向右滚动时，栏不再跨越页面的宽度，而是留在后面。我明白为什么会发生这种情况，但我不知道该怎么做才能解决它。如果您有任何想法，请告诉我。谢谢！

示例页面

Answer 1

好吧，您已将 #header 设置为 100% 的包含块（这将是主体）。当您缩小正文时，标题的宽度会缩小。如果主体的宽度小于容器的宽度，黑条将不会一直延伸。

你更希望它做什么？

- 没有滚动条：取出容器，使用#header 将文本居中

- 黑条扩大了整个距离：解决这个问题的最简单方法是给容器一个背景色。

Answer 2

改变：

width: 978px;

到：

max-width: 978px

这似乎在 FF3、IE7 和 chrome 中起到了作用。