CSS：带有文本的液体条不会扩展
我有一个水平条的宽度为100%。 在水平栏中，我的文本在 978px 容器内左对齐。 每当浏览器窗口缩小到宽度小于 978px 时，页面底部就会出现一个滚动条。 每当我向右滚动时，该栏不再跨越页面的宽度，而是留在后面。 我明白为什么会发生这种情况，但我不知道该怎么做才能解决它。 如果您有任何想法，请告诉我。 谢谢你！
I have a horizontal bar that has been given a width of 100%. Within the horizontal bar, I have text that is left-aligned within a 978px container. Whenever the browser window is shrunk so that it is less than 978px wide, a scrollbar along the bottom of the page appears. Whenever I scroll to the right, the bar no longer spans the width of the page but instead, is left behind. I understand why this happens, but I don't know what to do to fix it. If you have any ideas, let me know. Thank you!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
好吧，你已经将 #header 设置为 100% 的包含块（这将是主体）。 当缩小正文时，标题的宽度也会缩小。 如果主体的宽度小于容器的宽度，则黑条不会完全延伸。
您到底希望它做什么？
-没有滚动条：取出容器，使用#header将文本居中
-黑条扩展整个距离：解决这个问题的最简单方法是为容器提供背景颜色。
well, you have #header set to 100% of it's containing block (which would be the body). When you shrink the body, the header's width shrinks. If the body's width is less than the container's width, the black bar will not extend the whole way.
What exactly would you rather it did?
-not have a scroll bar: take out the container, center the text using #header
-the black bar expands the whole distance: The easiest way to solve that is to give the container a background-color.
更改：
至：
这似乎在 FF3、IE7 和 chrome 中有效。
Change:
to:
That seemed to do the trick in FF3, IE7 and chrome.