Html 缩放时的CSS问题

我为大于1100像素的屏幕编写了CSS。当我按ctrl键和+（加号）并放大时，页面的中心容器无法换行。它突然断了

HTML:

<div id="outer_footer_bottom">
    <div class="center">
        blabla balaa blabalblabla
    </div>
</div>

<style>
    #outer_footer_bottom{
        width: 100%;
        float: left;
        background: #8ac53f;
        height: 26px;
        padding: 16px 0 0 0;
        text-align: center;
        color: #fff;
        overflow-x: auto;
    }

    .center {
        width: 1000px;
        margin: 0 auto;
    }
</style>

巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴

CSS:

<div id="outer_footer_bottom">
    <div class="center">
        blabla balaa blabalblabla
    </div>
</div>

<style>
    #outer_footer_bottom{
        width: 100%;
        float: left;
        background: #8ac53f;
        height: 26px;
        padding: 16px 0 0 0;
        text-align: center;
        color: #fff;
        overflow-x: auto;
    }

    .center {
        width: 1000px;
        margin: 0 auto;
    }
</style>

#外底{
宽度：100%；
浮动：左；
背景#8ac53f；
高度：26px；
填充：16px0；
文本对齐：居中；
颜色：#fff；
溢出-x：自动；
}
.中心{
宽度：1000px；
保证金：0自动；
}

尝试使用媒体查询获得响应性强的网页设计

检查以下文章以开始

---

从中心类样式中删除宽度：1000px。

您的代码没有问题。当您增加或减少缩放级别时，它在

#外部(页脚)底部具有100%的宽度

，并且当您的缩放级别小于

中定义的1000px时显示滚动条。中心

问题出在您的代码中

您的

“外部\u页脚\u底部”

div的宽度为100%（未固定）
而

“center”

div的宽度为1000px（固定）

假设您的缩放级别为100%，窗口大小约为1200px，这意味着您的

“外部页脚底部”div的宽度为1200px，而
“中心”div的大小为1000px。

确定当您增加缩放级别时，窗口大小减小，
“外部页脚底部”
的大小将小于1000px。但
“center”
div的大小保持不变，即1000px

这就是你面临这个问题的原因

解决方案1:将“外部页脚底部”div的宽度更改为固定宽度（例如1000px或1200px）

解决方案2:将“中心”div的宽度更改为未固定（例如100%或90%）
Ctrl+/-不增加屏幕大小，而是更改缩放level@slash197是，我对缩放级别有问题：）我不需要使其响应……我对缩放级别有问题……）但是已经为外部div定义了一个宽度。因此不会有任何问题。@slash197您可以使用上面的代码尝试并验证它。谢谢：-）我对滚动条没有问题，我对#外部#页脚#底部有问题，它的颜色没有100%的宽度…：）它的颜色是相同的，但似乎是隐藏的，但上下滚动停留在滚动条上查看文本。这是一个高度问题，你应该定义高度。