New Topic/Question
Reply
This is my first attempt at doing a css dropdown menu. I was reading a tutorial about how to do it. I followed the steps as they said that I should. However I am unable to get the code to work properly. I get the first level to work properly but when I move the mouse over the links that say American League or National League. It does not show the list of the teams.
Was the tutorial wrong or did I do something wrong. I am not familiar with doing multi level dropdown menus like this but I would like to learn.
This is the code that I am using to make the menu
<style>
.side_nav {
width:100px;
font-size:12px;
}
.side_nav ul {
margin: 0px;
padding: 0px;
}
.side_nav ul li {
height: 25px;
line-height: 25px;
padding-left: 10px;
list-style: none;
cursor:pointer;
}
.side_nav ul li:hover {
background-color: #333;
position: relative;
}
.side_nav ul ul {
width: 150px;
display: none;
position: absolute;
left: 75px;
top: 5px;
}
.side_nav ul li:hover ul {
display:block;
}
.side_nav ul ul li {
width: 150px;
float: left;
display:inline;
}
.side_nav ul ul li:hover {
text-decoration:underline;
border:none;
}
.side_nav li:hover ul li ul {
display:none;
}
.side_nav ul > ul > ul > ul ul li ul {
left:110px;
background-color:#0099CC;
}
.side_nav ul > ul ul li:hover ul {
display:block;
}
</style>
</head>
<body>
<div class="side_nav">
<ul>
<li>Team
<ul>
<li>American League
<ul>
<li>Baltimore Orioles</li>
<li>Boston Red Sox</li>
<li>Chicago White Sox</li>
<li>Cleveland Indians</li>
<li>Detroit Tigers</li>
<li>Kansas City Royals</li>
<li>Los Angeles Angels</li>
<li>Minnesota Twins</li>
<li>New York Yankees</li>
<li>Oakland Athletics</li>
<li>Seattle Mariners</li>
<li>Tampa Bay Rays</li>
<li>Texas Rangers</li>
<li>Toronto Blue Jays</li>
</ul>
</li>
<li>National League
<ul>
<li>Arizona Diamondbacks</li>
<li>Atlanta Braves</li>
<li>Chicago Cubs</li>
<li>Cincinatti Reds</li>
<li>Colorado Rockies</li>
<li>Florida Marlins</li>
<li>Houston Astros</li>
<li>Los Angeles Dodgers</li>
<li>Milwaukee Brewers</li>
<li>Philadelphia Phillies</li>
<li>Pittsburg Pirates</li>
<li>St. Louis Cardinals</li>
<li>San Diego Padres</li>
<li>San Fransico Giants</li>
<li>Washington Nationals</li>
</ul>
</li>
</ul>
</li>
<li>Year</li>
</ul>
Any help or explanation would be helpful
MultiQuote
| 