2

こんにちは、HTML と CSS を使用してポートフォリオ Web サイトを作成しましたが、非常に奇妙なことに気付きました。最新のブラウザー Internet Explorer 9 、Google Chrome 、FireFox のすべてで Web サイトをテストしました。私のパソコンからこのリンクをロードしてください：

ポートフォリオ

すべてが正常に機能していることを確認するために、アドビ ブラウザ ラボでサイトをテストしたところ、問題があることがわかりました。通常、各行に 4 つの画像があるはずですが、ブラウザ ラボでは、すべてのブラウザで4枚目の画像は押し下げ中です。

最新の Chrome 、 FIrefox 、 Internet Explorer 9 がインストールされている別のコンピューターでこれをチェックしました。

ブラウザーとコンピューターの両方の解像度が同じで、Windows 7 Home Premium の両方で使用していますか?

この問題の原因は何ですか? 同じ Web サイトが、同じブラウザー バージョンでも異なるコンピューターでは異なるように見えるのはなぜですか?

4

1 に答える 1

2

古いCSSを一時的に保存している可能性があります。CTRL + F5の儀式的なアプリケーションを試しましたか

また、ズームが 100% であることも確認してください。

幸運を！

- 編集

「portofoliu」div の最大幅は 940 ピクセルです。各「portofolioGalery」div は幅 220 ピクセルで、マージンはそれぞれ 17 ピクセルです。最初と 5 番目の画像のマージンは削除されています。これは、アイテムが収まる必要があることを意味します。

firebug を使用して「portofolioGalery」アイテム間をフリックすると、それらの間に小さなギャップが表示されました。何が起こっているのかというと、「display:inline-block;」です。わずかな幅を追加しています！「float:left;」に置き換えました。そしてそれはすべて、あるべき場所に正確に行きます。

この人のブログには、他の解決策とその理由の説明があります。

于 2012-09-02T09:54:44.720 に答える