1

私の問題の写真:

ここに画像の説明を入力

最初（左から右へ）は Google chrome です。2位はオペラ。Opera のように、他のすべてのブラウザーのサイズで。他のサイトも同様に表示されます。

「Yahoo」から「CSSをリセット」。私のサイトの残りの部分と同じたわごと。それらは、Google Chrome 以外の他のブラウザーでは比例して減少しているように見えます (しかし、他のサイト (私のものではない) は、このすべてのブラウザーでまったく同じように見えるため、問題は Chrome にはありません)。

私の質問がばかげている場合は申し訳ありませんが、この問題を解決する方法が本当にわかりません。

.wrapper {
  width: 960px;
  margin: 0 auto;
}

.header {
  width: 100%;
  min-width: 960px;
  height: 300px;
  background: #fff;
}
4

1 に答える 1

2

これにはいくつかの問題がある可能性があります。一般的な確認事項は次のとおりです。

  1. Chrome が拡大されていないことを確認してください。注意深く見ると、Chrome のすべてが少し大きくなっていることがわかります。Ctrl+0 は、誤ってズームインしないようにする必要があります。

  2. Chrome では既知の問題ではないことを確認してください。Chrome のレンダリングが少し大きいことについての言及を見ましたが、それはおそらく始めるのに適した場所でしょう。他のサイトで見られないからといって、Chrome が愚かではない可能性を排除しないでください。IE 6-8 でもおそらく同じように見えますが、これらのサイトをそのように取得するために必要なすべてのフープを取り除くと、おそらくかなり壊れたエクスペリエンスが見つかるでしょう. Chrome が期待どおりに動作するために必要な努力がなかったとは言えません。

  3. Chrome の開発者ツールを使用して、期待する値が実際に使用されているものであることを確認してください。高さが 300px で、テキストが 20px だと思っているからといって、実際にそうであるとは限りません。また、奇妙な継承の不具合 (または CSS が適切に読み込まれていない) もありません。

また、ブラウザが多少異なっていても問題ありません。上司が首をかしげているなら、できることはあまりないことは理解しています。ただし、このような問題のトラブルシューティングを試みるとき、または設計上の決定を下すときでさえ、その事実を念頭に置いてください. 場合によっては、実際の見返りがないのに数え切れないほどの時間 (ビジネスの状況では多額のお金に相当) を費やすよりも良いことがあります。これについて考えてみてください -実際に 2 つのブラウザーを並べてピクセル単位で比較したり、そのような違いに気付くユーザーはどれくらいいるでしょうか (さらに言えば、ブラウザーが何であるかさえ知っているユーザーはどれくらいいるでしょうか)。

于 2012-09-17T18:22:07.223 に答える