0

WordPress の Web サイトを IE6 で正しく表示するのに大きな問題があります。

以下のスクリーンショットへのリンク。背景画像が欠落しており、ナビゲーションが数ピクセル余分にノックダウンされており、コンテンツのほとんどが中心からずれています。

www.genevarealtytrust.com/content/wp-content/themes/wp-terra-basic/images/ie6_wpterra.jpg

FF のスクリーンショット (以下にリンク) は、次のようになります。Safari、いくつかのバージョンの Firefox、および IE7 で試してみましたが、すべて想定どおりに見えます。IE6だけが私に問題を引き起こしています。

www.genevarealtytrust.com/content/wp-content/themes/wp-terra-basic/images/ff_wpterra.jpg

何か案は??

リンク: www.genevarealtytrust.com/content

コードを検証し、いくつか試してみましたが、成功しませんでした。

ヘルプ!感謝します!

4

3 に答える 3

1

条件付きスタイルを試すことができます。ドキュメントのheadセクションに次を貼り付けます。

<!--[if lte IE 6]>
<link rel="stylesheet" media="screen,projection" href=www.example.com/ie.css" type="text/css" />
<![endif]-->

これで、他のブラウザのデザインを損なうことを心配することなく、ie.css の編集を開始できます。

nav の周りの余分なスペース: IE には、他のブラウザーとは異なるデフォルトのマージン/パディングがある場合があります。定義してみる

#something {
margin: 0; 
padding: 0;
}

あなたの新しいcssで明示的に。

背景なし: 配置の問題かもしれません。背景画像の定義に「左上」などを追加してみてください。例:

background-image: url('../img/site-bg.jpg') no-repeat scroll top right;

コンテンツのセンタリング: CSS では、コンテンツをセンタリングする方法が 2 つあります。最初: 親要素のtext-alignプロパティを中央に設定します。. 2 番目:幅を定義し、マージンtop-bottom-margin-value auto に設定します。. 例:

#something {
 width: 100px;
 margin: 10px auto;
}

これがあなたの問題の解決に役立つことを願っています:)

于 2009-07-21T21:15:10.820 に答える
0

ヒントをありがとう!Daveslab、私は間違いなくそのリストを手元に置いておきます、そして本の推薦に感謝します。

センタリングの問題/背景画像の欠落:

代替のcssドキュメントを作成したところ、実験の余地が増えました。試行錯誤によって問題のあるセクションのCSSを少し単純化することで、欠落している背景画像と中央揃えの問題を解決できました。(フロートを取り外し、位置...)

余分なピクセル:

最終的に私のヘッダーの下部にある3つのピクセルを修正することになったのは...ただ愚かでした。

明らかに、IE6はヘッダー画像の下部に余分な3ピクセルを適用していました。これは、そのdivのHTMLコードが3行に分割されていたためです...

<div id="header">
<img src="url" />
</div>

それらをすべて1行にまとめるだけで、下部の余分なパディングがなくなりました。ばかげた...(そして醜い)

<div id="header"><img src="url" /></div>

解決しようとしている右側にまだ余分なピクセルがあります-まだ調査中です。

于 2009-07-22T17:31:52.097 に答える
0

これは実際にはあなたの質問に対する答えではありません (そして、コメントするのに十分な担当者がいないためです :) ) が、一般的な IE CSS バグのリストを実行してみてください。CSS のいくつかの問題を解決するのに役立ちましたが、IE 6 は戦場です。それ以外の場合は、素晴らしい本Bulletproof Web Designを入手することをお勧めします。

于 2009-07-21T21:10:14.463 に答える