2

私はこのクラスのdivを持っています:

 .header {
    width: 100%;
    height: 10%;
}

これを Web 開発者ツールで調べると、ブラウザーが要素の幅と高さをどのように計算するかがわかります。

Internet Explorer 9 --> 854.24 x 26.05

Firefox 15.01 --> 854×28

サファリ5.1.7 --> 843×27

クロム 22.0.1229.94 m --> 951 x 36

上記のように、Chrome は別の方法で % を計算します。どうすればこれを解決できますか? これはバグですか？Safari も webkit を使用しますが、その問題はありません。

4

1 に答える 1

0

表示されているのは、viewport、html、および body タグのサイズに基づく計算です。ビューポート (ウィンドウに表示される領域) が変更されると、html->body->div のサイズも変更されます。別のツールバーを追加するだけで、これらのサイズが変更されます。

これは、コンテンツが要素のサイズを決定する「レスポンシブ Web デザイン」の目的の 1 つであり、デバイスのピクセル数に基づいてレイアウトする必要はなくなりました。しかし、それは本当に深くなり、トピックから外れます。

于 2012-10-19T14:24:50.943 に答える