1 Help with Dropdown Menu Fri Jul 01, 2011 10:34 pm
Drogba921
Registered Member
Hey guys... I'm currently developing a new version of my site:
And i've hit a problem.
I need to get the button: Game Pages - to drop down and show the list: Action, Adventure, Arcade, Puzzle, Shooting, Sports... But I can't figure out how. Can anyone help me?
Here's my CSS:
Here's my HTML:
And i've hit a problem.
I need to get the button: Game Pages - to drop down and show the list: Action, Adventure, Arcade, Puzzle, Shooting, Sports... But I can't figure out how. Can anyone help me?
Here's my CSS:
- Code:
#nav {
width: 940px;
height: 60px;
margin: -20px auto 0px auto;
}
ul#navigation {
width:1000px;
margin-left: 0px;
list-style:none;
height:57px;
}
ul#navigation li {
display:inline;
}
ul#navigation li a {
height:57px;
float: left;
color: #ffffff;
font-family: "Century Gothic", Arial, Sans-Serif;
text-shadow: 0.1em 0.1em 0.2em black;
text-decoration:none;
text-align: center;
margin-right: -10px;
}
ul#navigation li a span {
display:block;
text-align: center;
padding: 12px 0px 10px 0px;
}
ul#navigation li#navigation-1 a {
width:155px;
background:url) no-repeat 0px 0;
}
ul#navigation li#navigation-1 a:active,
ul#navigation li#navigation-1 a:hover {
background-position:0px -57px;
}
ul#navigation li#navigation-1 a.current {
background-position:0px 0px -57px;
}
Here's my HTML:
- Code:
<div id="nav">
<ul id="navigation">
<li id="navigation-1"><a href="#" title="Lorem Ipsum"><span>Home</span></a></li>
<li id="navigation-1"><a href="#" title="Lorem Ipsum"><span>About</span></a></li>
<li id="navigation-1"><a href="#" title="Lorem Ipsum"><span>Contact</span></a></li>
<li id="navigation-1"><a href="#" title="Lorem Ipsum"><span>Game Pages</span></a></li>
<li id="navigation-1"><a href="#" title="Lorem Ipsum"><span>High Scores</span></a></li>
<li id="navigation-1"><a href="#" title="Lorem Ipsum"><span>Advertising</span></a></li>
</ul>
</div>
Last edited by Drogba921 on Mon Jan 16, 2012 9:25 am; edited 1 time in total