1

1100px以上の画面サイズ用にCSSを書きました。ctrl と +(プラス) 記号を押してズームすると、ページの中央のコンテナーが折り返されません。突然壊れます。

HTML:

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

CSS:

<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>
4

4 に答える 4

1

問題はあなたのコードにあります。

divの"outer_footer_bottom"幅は100%(固定されていません)
で、"center"divの幅は1000px(固定)です

ズーム レベルが 100% で、ウィンドウ サイズが約 1200px であるとします。これは、"outer_footer_bottom"div の幅が 1200px で、"center"div のサイズが 1000px であることを意味します。

ズーム レベルを上げると、ウィンドウ サイズが小さくなり、サイズが"outer_footer_bottom"1000px 未満になります。ただし、divのサイズは変更さ"center"れません。つまり、1000pxです。

それがあなたがこの問題に直面している理由です。

解決策1:「outer_footer_bottom」div の幅を固定 (1000px または 1200px など) に変更します。

解決策 2:「中央」の div の幅を固定しない (例: 100% または 90%) に変更します。

于 2013-08-28T08:31:58.913 に答える
0
.center {
        margin: 0 auto;
    }

センター クラスのスタイルから width:1000px を削除します。

于 2013-08-28T06:55:57.800 に答える