这是我的 css ......前段时间写了这个,它完美地在 IE/Firefox/Chrome 上运行,最近又回到了它,现在很惊讶它不会在 IE 中显示我的下拉导航。帮助?
http://pastebin.com/smRU6Syb = html
/* ANYTHING UNDEFINED */
*
{
margin:0px;
border:none;
}
/* CONTENT WRAPPER */
#contentwrapper {
margin-left: auto;
margin-right: auto;
margin-bottom:50px;
width: 800px;
border:1px solid black;
background-image:url('contentbg.png');
}
/* IMAGE GALLERY */
div.img
{
margin:2px;
margin-left:auto;
float:left;
text-align:center;
}
div.img img
{
display:inline;
border:1px solid black;
}
div.img a:hover img
{
border:2px solid #0000ff;
}
div.desc
{
text-align:center;
font-weight:normal;
width:120px;
margin:2px;
} /**** ^^^END IMG GALLERY^^^ ****/
/* TITLE PANEL */
#titlepane {
background-color: white;
background-image:url(badgesketch.jpg);
background-repeat: no-repeat;
margin-left: auto;
margin-right: auto;
text-align:center;
width: 800px;
\width: 800px /* IE9 */
}
/* LEFT ALIGN ANYTHING WITH LA ID'S */
#la{
text-align:left;
}
/* BODY TEXT AND CONTENT */
#btext {
margin-top:50px;
min-height:500px;
text-align:CENTER;
margin-left:20px;
margin-right:20px;
margin-bottom:20px;
}
/* NAVBAR DIV */
#navbar {
width:800px;
\width:800px;
}
/* NAV ID'S */
#nav {
background-image:url('navbarbg.png');
list-style: none;
font-weight: bold;
/* Clear floats */
float: right;
width: 760px;
/width:800px;
height:45px;
/* Bring the nav above everything else--uncomment if needed.
position:relative;
z-index:5;
*/
}
/* NAV LI'S */
#nav li {
float: left;
margin-right: 10px;
position: relative;
}
/* TOP LINKS ACROSS THE NAVBAR (NON-DROPDOWNS) */
#top {
margin-top:7px;
margin-bottom:7px;
}
/* FIRST NON-DROPDOWN LINK (CENTERING) */
#first{
margin-left:35px;
/margin-left:73px;
margin-top:7px;
margin-bottom:7px;
}
/* FOOTER */
#foot{
text-align:center;
border-top: 1px solid black;
background-color:white;
margin:0px;
padding:10px;
}
/* LINKS WITH NAV ID'S */
#nav a {
display: block;
padding: 5px;
color: white;
background: black;
border: 1px solid white;
text-decoration: none;
text-align:center;
z-index:400;
}
/* HOVERED LINKS WITH NAV ID'S */
#nav a:hover {
color: red;
background: #000262;
text-decoration: underline;
}
/* UL'S WITH NAV ID'S */
#nav ul {
background: black; /* Background color of the dropdown */
background: rgba(255,255,255,0); /* Transparency of the Background*/
list-style: none;
position: absolute;
left: -9999px; /* Hide the dropdown off-screen when not needed */
}
/* UL LI'S WITH NAV ID'S */
#nav ul li {
padding-top: 0px; /* spacing between the li's */
float: none;
}
/* UL LINKS WITH NAV ID'S */
#nav ul a {
white-space: nowrap; /* No text wrapping keeps links on one line*/
}
/* HOVERED LI'S WITH NAV ID'S (DISPLAYING DROPDOWNS) */
#nav li:hover ul { /* Display the dropdown on hover */
left: -60px; /* Bring back on-screen when needed -60px is roughly centered */
}
/* HOVERED LI'S WITH NAV ID'S (TOP LINK HOVERED) */
#nav li:hover a { /* Top link remains hovered */
background: black;
text-decoration: underline;
}
/* HOVERED LI'S WITH NAV ID'S (REMOVING EFFECTS) */
#nav li:hover ul a { /* Remove effects */
text-decoration: none;
}
/* HOVERING OVER DROPDOWN LI'S WITH NAV ID'S */
#nav li:hover ul li a:hover { /* What happens when you hover over a dropdown link*/
background:#000262;
}
我尝试更改 z-indexes,但没有效果。谢谢您的帮助。