I know its probably something simple, but for the life of me I cannot figure out why my navigation drop-down stopped working.
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="lib/style.css" />
</head>
<body>
<div id="wrapper">
<div id="header">
<ul id="nav">
<li><a href="index.php">Home</a>
<ul>
<li><a target="new" href="/Forums">Forums</a></li>
</ul>
</li>
<li><a href="Contacts.php">Contacts</a>
<ul>
<li><a href="contacts_admin.php">Admin</a></li>
</ul>
</li>
</ul>
</div>
<div id="content">
<div id="sidebar"> Sidebar </div>
<div id="main">
MAIN
</div>
</div>
<div id="footer"> FOOTER </div>
</div>
</body>
</html>
CSS
html,
body
{
background: #909EAB url(images/bg.png);
height: 100%;
margin: 0;
padding: 0;
}
#wrapper
{
height:100%/9; /* For IE8 and below */
min-height: 100%;
position: relative;
}
#header
{
background: #EFEFEF;
width: 100%;
}
#content
{
padding-bottom: 60px; /* Height of the footer element */
}
#sidebar
{
background: pink;
float: left;
padding: 10px;
width: 20%;
}
#main
{
background: tan;
padding-top: 30px;
}
td
{
border: 1px solid black;
color: black;
font-size: 0.80em;
}
/*---------------------------------*/
/*---------- Navigation ----------*/
/*-------------------------------*/
/*----- ALL LISTS -----*/
#nav,
#nav ul
{
background: #EFEFEF;
float: left;
margin: 0;
padding-bottom: 1px;
padding-left: 5px;
width: 99.5%;
z-index:9999;
}
#nav li
{
display: inline;
float: left;
font-family: "Book Antiqua", Georgia, serif;
font-size: 90%;
font-weight: bold;
list-style: none;
margin-right: 50px;
text-align: left;
}
#nav a
{
color: #757575;
text-decoration: none;
}
#nav a:hover
{
background-color: #5F6975;
color: #FFFFFF;
}
/* ----- SECOND LEVEL LISTS -----*/
#nav li ul
{
background: #5F6975;
left: -999em;
position: absolute;
width: 150px;
}
#nav li ul li
{
width: 155px;
}
#nav li ul a
{
color: #FFFFFF;
font-size: 1em;
padding-bottom: 5px;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
}
#nav li ul a:hover, a.sfhover
{
background-color: #4b545f;
color: #FFFFFF;
}
/*---------------------*/
/* ----- FOOTER ------*/
/*-------------------*/
#footer
{
bottom: 0;
border-top: 2px solid grey;
height: 60px;
left: 0;
position: absolute;
width: 100%;
}
#footer cite
{
display: block;
font-size: 0.65em;
font-style: normal;
font-weight: bold;
letter-spacing: 1px;
margin-right: 25px;
text-align: right;
text-transform: uppercase;
}
#footer p
{
font-style: italic;
margin-bottom: 5px;
text-align: center;
}
