IE6でのCSSポップアップの問題

Question

私は画像の上にマウスのポップアップ（ツールチップのような）を表示する必要があるHTMLページがあります。以下のコードはIE8とFirefoxで正常に動作しています。IE6に問題があります。ホバーのポップアップは表示されません。

STYLE: 
    /* css style */ 
    .ToolTip { position: relative; cursor: default; text-decoration: none; border: none;} 

    .ToolTip a span {display: none; text-decoration: none; color: #FFFFFF; } 

    .ToolTip a:hover span { overflow:hidden; text-decoration: none; display: block; 
    position: absolute; width: 250px; background-color: #046C08; border: none; height: 90px; 
    left: 25px; top: -10px; color: #FFFFFF; padding: 5px; line-height: 18px; z-index: 1; } 

    HTML: 

/* html page content */ 

    <p class="ToolTip"> 
     <a href="#"> 
      <img src="...." alt="" style="border: 0px;" /> 
    <span> 
       CSS Popup.. 
    </span> 
     </a> 
    </p> 

どうかお願いしますか？ ありがとうございました

Answer 1

ハッピー・シンが述べたように、ほとんどのサイトでIE6互換性はサポートされていません。しかし、あなたはそれを修正しようとする可能性があります：

あなたのスタイルシートには多くのパラメータがありますが、それらをすべて意図的に使用しましたか、それとも機能するように何度も追加しようとしましたか？

など。見る：

。ツールヒント{ディスプレイ：なし;テキスト装飾：なし;色：#FFFFFF; }

あなたは既に表示しているかのように、ここでは色とテキストの装飾を宣言する必要はありません：なしに、要素はとにかく示すべきではありません。 Btwでは、：hover状態で同じ色を宣言しているので、とにかく二重になります。あなたが投稿したコードとして

は、全体のコードの一部でしかありません、私もちょうど推測するが、いくつかのヒントができ、私たちは見れば：

.ToolTip：ホバースパン{オーバーフロー：隠されたが、テキスト装飾：なし;表示ブロック; ポジション：絶対;幅：250px;背景色：＃046C08;ボーダー：なし;高さ：90px; 左：25ピクセル。 top：-10px;色：#FFFFFF;パディング：5px;ライン高さ：18px; z-インデックス：1; }

同様に、オーバーフローの必要はありません。非表示です。これは、幅が250ピクセル、高さが90ピクセルよりも長い場合は、スパン要素のテキストを非表示にします。しかし、あなたの質問に関係なくです。

しかし、ホバリングされていないときにスパン要素に何の位置も宣言していないので、それほど巧妙ではないかもしれませんが、状態が浮かび上がると、突然位置などが追加されます。表示または表示を変更しただけでは、スパン要素は位置を変更しません。

so ...

表示：ブロックが時々間違って解釈される可能性があります。位置：絶対 - ここに行きます：画像の上にスパン要素を配置しましたか？またはページ外（おそらく完全ではないかもしれませんが、大きすぎるかもしれません）。画像の背後に配置した場合は、上、左、Z-インデックスを変更することができます。 Z-インデックスを変更する場合は、イメージにZ-インデックスを割り当てたり、両方のZ-インデックス値を削除したりしてください。 Z-インデックスを割り当てる場合は、2つの値の間に大きな差を設定するか、正の値と負の値の差を大きく設定してください。

すべての要素で、各要素に必要な最小限のパラメータから始めてください。次に、本当に必要なものを追加します。スパン要素にすべてのパラメータを別々に設定して、ディスプレイのみを変更してください。