http://www.devinrols...orizontal-menu/
It is excellent at explaining everything about it. However, I am having an issue trying to get it to work. I am stuck at the part where it actually creates the drop down effect. I put in the code exactly as the tutorial explained but nothing drops down when I mouse over the link. Code is as follows:
html
<html>
<head>
<title>
My First CSS Menu
</title>
<link rel="stylesheet" type="text/css" href="menu.css" />
</head>
<body>
<div id="navigation">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Menu Item 2</a>
<ul>
<li>Sub 1</li>
</ul>
</li>
<li><a href="#">Menu Item 3</a></li>
<li><a href="#">Menu Item 4</a></li>
</ul>
</div>
</body>
</html>
css
#navigation{
width:100%;
height:30px;
background-color:#999;
}
#navigation ul{
margin:0px;
padding:0px;
}
#navigation ul li{
display:inline;
height:30px;
float:left;
list-style:none;
margin-left:15px;
}
#navigation li a{
color:#fff;
text-decoration:none;
}
#navigation li a:hover{
text-decoration:underline;
}
#navigation li ul
{
margin:0px;
padding:0px;
display:none;
}
#navigation li:hover ul
{
display:block;
width:160px;
}
#navigation li li
{
list-style:none;
display:list-item;
width:100%;
}
I am using IE. Thank you in advance for any help as to what I am doing wrong.

New Topic/Question
Reply


MultiQuote




|