CSSの問題：IEのカスタムul、liドロップダウンナビゲーション、特にie6 overflow：visibleバグ
https://stackoverflow.com/questions/1632418
-
06-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian質問
ie6バグの本質（ドロップダウンエントリは、overflow：visibleとして機能するのではなく、誤って展開することを防ぐために、隠されたオーバーフローを介して切り捨てる必要があります）サイト http://zd-cms.com
間違った（ie6）：
右（FF、IE8、Chrome）：
メニューエントリには次のように表示されます。
- お問い合わせ
- リセラー
- サポート
- デザイナーサービス
しかし、overflow：visibleが動作しない、またはシミュレートできないため、ドロップダウンメニューの一部が切り取られます。現在、IE6固有のスタイルシートのCSSは次のとおりです。
#zd-nav {
padding-left:0;
margin-left:0;
background-color:transparent;
}
#zd-nav .zd-sub-nav{
margin-top:5px;
**width:73px**;
**overflow:hidden;**
}
私が試したバグのいくつかの解決策： ie6 overflow：visibleバグを知っています（ http：// www .positioniseverything.net / explorer / expandingboxbug.html ）、overflow：visible null and voidをレンダリングします。 通読： IE6のレイアウトバグを修正するための戦略を試しましたoverflow：visibleとして実際に動作させようとするハックはほとんどありませんが、何も機能しませんでした。
すぐに、メニューのドロップダウン部分をoverflow：hiddenに設定しました。これは、ie6でメニューをoverflow：visibleのように動作させることができないためです。
ie7またはie8のnavの問題を指摘していただければ幸いです。
提案？
解決
これは私のために働いた：
#zd-nav .zd-sub-nav li{
float:left;
clear:left;
position:relative;
z-index:20; /* or some other arbitrary biggish number */
}
フロートはliに適切な幅を与え、相対位置とz-indexはulの上に表示します（拘束されません）。
他のヒント
これを試してください（ドロップダウン[プラスサブサブサブ]で、ページ上の邪魔になった他の要素を「フロート」できるようにする場合）：
.zd-nav-active {
position: relative;
}
.zd-sub-nav {
position: absolute;
z-index:10000;
}
liを含むサブナビゲーションを相対位置に強制しても、ページ上の位置は変更されません。ただし、子要素に絶対位置を使用することはできますが、子要素はデフォルトで親内に保持され、「フロー」から解放されます。ページの（したがって、プッシュダウン効果を防ぎます）。
次のいずれかを試してください：
word-wrap:break-word; /*use this in the #zd-nav .zd-sub-nav class*/
または...
width:100%; /*instead of setting the width to 73px*/
height：100％; もできます。
これは、Microsoftが発明したhasLayoutの問題です。ここで情報を見つけました： http://zoffix.com/css/ie/haslayout.shtml
これが役立つことを願っています...
これは動作するはずです
#zd-nav .zd-sub-nav{
margin-top:5px;
width: auto;
display: block;
overflow: visible
}
自動幅は、各ナビゲーション項目に固定幅を与える必要なく、各ナビゲーション項目のサイズを採用するために使用されます。
これがお役に立てば幸いです。
コンテナの相対位置を使用し、上下と幅を指定することをお勧めします
