2010-03-05 92 views
0

我的下拉菜單在IE6中不起作用。這裏是CSS代碼IE6下拉菜單導航不起作用

a:focus { 
outline:none;} 

.menu { 
width:1000px; 
height:32px; 
position:relative; 
z-index:100; 
font-family:arial, sans-serif; 
} 

/* hack to correct IE5.5 faulty box model */ 
* html .menu { 
width:1000px; 

} 

/* remove all the bullets, borders and padding from the default list styling */ 
.menu ul { 
padding:0; 
margin:0; 
list-style-type:none; 
} 

.menu ul ul { 
width:149px; 
} 

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */ 
.menu li { 
float:left; 
width:149px; 
position:relative; 
border-top: #999 1px solid; 
margin-right:10px; 
} 

.menu li:hover { 
float:left; 
border-top: #ff0 1px solid; 
} 

.nav-selected { 
font-weight: bold; 
} 

.menu li li:hover { 
float:left; 
border-top: none; 
color: #999; 
} 

.menu li li { 
float:left; 
width:149px; 
position:relative; 
border-top: none; 
} 


/* style the links for the top level */ 
.menu a, .menu a:visited { 
display:block; 
font-size:12px; 
text-decoration:none; 
color:#999; 
width:149px; 
height:26px; 
line-height:29px; 
} 

/* a hack so that IE5.5 faulty box model is corrected */ 
* html .menu a, * html .menu a:visited { 
width:149px; 
w\idth:149px; 
} 

/* style the second level background */ 
.menu ul ul a.drop, .menu ul ul a.drop:visited {} 
/* style the second level hover */ 
.menu ul ul a.drop:hover{} 
.menu ul ul :hover > a.drop {} 
/* style the third level background */ 
.menu ul ul ul a, .menu ul ul ul a:visited {} 
/* style the third level hover */ 
.menu ul ul ul a:hover {} 

/* hide the sub levels and give them a positon absolute so that they take up no room */ 
.menu ul ul { 

visibility: hidden; 
position:absolute; 
height:0; 
top:26px; 
left:0; 
width:150px; 

} 

/* another hack for IE5.5 */ 
* html .menu ul ul { 
top:26px; 
t\op:27px; 
} 

/* position the third level flyout menu */ 
.menu ul ul ul{ 
left:149px; 
top:-1px; 
width:149px; 
} 

/* position the third level flyout menu for a left flyout */ 
.menu ul ul ul.left { 
left:-149px; 
} 



/* style the table so that it takes no ppart in the layout - required for IE to work */ 
.menu table { 
position:absolute; 
top:0; 
left:0; 
border-collapse:collapse; 
} 

/* style the second level links */ 
.menu ul ul a, .menu ul ul a:visited { 
color:#999; 
height:auto; 
line-height:15px; 
padding-bottom:4px; 
width:149px; 
} 

/* yet another hack for IE5.5 */ 
* html .menu ul ul a, * html .menu ul ul a:visited { 
width:149px; 
w\idth:149px; 
} 

/* style the top level hover */ 
.menu a:hover {color:#ff0;} 
.menu ul ul a:hover {color:#ccc;} 
.menu :hover > a {color:#ff0;} 
.menu ul ul :hover > a {color:#ccc;} 

/* make the second level visible when hover on first level list OR link */ 
.menu ul li:hover ul, .menu ul a:hover ul{ 
visibility:visible; 
width: auto; 
} 
/* keep the third level hidden when you hover on first level list OR link */ 
.menu ul :hover ul ul{ 
visibility:hidden; 
} 
/* make the third level visible when you hover over second level list OR link */ 
.menu ul :hover ul :hover ul{ 
visibility:visible; 
} 

請儘快幫我...

+0

你能顯示你的HTML內容嗎? – antyrat 2010-03-05 14:43:11

+0

不以什麼方式工作?哪些瀏覽器? – Armstrongest 2010-03-05 14:45:30

+0

@Atomiton標籤和標題寫的ie6瀏覽器;) – antyrat 2010-03-05 14:49:22

回答

0

如果你談論的是不工作的菜單的實際下拉部分,這是因爲overflow命令折斷在IE6IE6沒有正確顯示overflow屬性(在這種情況下,overflow: visible允許顯示下拉菜單)。不幸的是,並不容易解決。您可以在網絡上搜索IE6的一些CSS Hacks,以嘗試修復溢出問題,但它們不適用於每種情況。祝你好運。