2011-01-27 21 views
2

通常、私はHTMLのエラーをそれほど複雑ではないので、自分で修正することができますが、今回は難しい問題です。ウェブサイトのHTMLクロスブラウザの問題

私のウェブサイトでナビゲーションを変更することに決めました。ほとんどのブラウザは正常に動作します。&ほとんどのブラウザで正しく表示されます。

ここで私の問題は、私はどこから来ているのか分からない5-6pxのマージンがあることです。私の問題を示すリンク&イメージは以下の通りです。

私の2番目の問題は、IE7が大きなマージンを示していることです。また、どこから来ているのかわかりません。

ウェブページのURLは次のとおりです。ここでは以下のDeaglegame.net &はイメージです。

http://i.stack.imgur.com/2SBP9.png

私は私がしたいの返信をいけないので、それはありません返信いけないので、もし私が、数時間で仕事のために残しています、私はできるだけ早くこのスレッドをチェックしますが、どんな助けでも大歓迎です!

誰でもお手伝いします。

+0

http://www.microsoft.com/downloads/en/details.aspx?FamilyID=95e06cbe-4940-4218-b75d-b8856fced535では、FirefoxのFirebugの行に沿ってページのDOMを調べることができます。 –

+0

私の仕事は何らかの理由でそのサイトをブロックしているので、私はimgリンクを見ることができません:(誰でも自分のマージンがどこにあるのか教えてください。)それは底ですか? – cp3

答えて

1

div#mainの@Mmerrellの修正は、問題の半分をソートする必要があります。次はあなたのul#navigation li a spanスタイルの@Bumble Beeの観測です。 SPAN要素の埋め込みによって、リンクがコンテンツをプッシュしています。

/* deaglegame.css (line 48) */ 
#navigate li:hover a span, 
#navigate li.hover a span, 
#navigate li.active a span { 
    /* removed padding: 12px 0 0; */ 
} 

/* deaglegame.css (line 30) */ 
#navigate li a span { 
    cursor: pointer; 
    float: left; 
    height: 38px; 
    line-height: 2.5; 
    /* removed padding: 12px 0 0; */ 
    position: relative; 
} 

これらのパディングを削除し、line-heightプロパティを設定します。一般に、paddingの代わりに、line-heightをテキストの垂直位置(ブロックとインライン要素の両方の内容に適用)に使用する方が良いでしょう。

+0

うわー、まだ1pxは残っているが、私はそれを管理することができます。これは大変感謝しています。 –

+0

ありがとう、しかし、すべての正直なところでは、私はMmerrellがこの1つのクレジットを得るべきだと思います。 –

0

最初の問題を解決する可能性のある下記の画像を確認してください。そこでパディングの値を小さくしてみてください。この種の問題を解決するには、火薬瓶のようなツールを使用することを検討してください。 enter image description here

2

IE7の問題は互換性のためです。これは、イントラネットアドレスを使用してページを訪問している場合、デフォルトで強制的に強制されます。この問題を回避するには、下のパディングを削除し、メインdivの高さを175pxに設定します。これは互換性ビューを実行しているときに余白の問題を修正するようにも見えます。

あなたはメニューリストのなんらかの原因で互換性ビューの外に余白が発生していますが、IEを実行してF12を押すと、開発ツールが開くはずです。

+0

この返信のおかげでたくさんありましたが、高さを入れてもまだ3px程度ですが、もう一度ありがとう!本当に感謝 –

0

将来的にはYUI CSSリセットを使用することを検討してください(または今でも統合することもできます)。http://developer.yahoo.com/yui/3/cssreset/。クロスブラウザー互換のサイトを設計する際にはかなり役に立ちました。私が遭遇する奇妙なマージンやパディングエラーをほとんど排除しました。

関連する問題