![]() |
|
![]() |
|
|
Thread Tools | Display Modes |
|
|
#1 |
|
Unverified User
Join Date: Aug 2005
Location: none
Posts: 146
Rep Power: 0
![]() |
CSS submenus
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>test</title>
<style type="text/css">
ul{
list-style:none;
width:10%;
padding:0;
}
li{background-color:#ff0000;color:#0000ff} li:hover{background-color:#0000ff;color:#ff0000}
a{text-decoration:none} /*get rid of underline*/
.vdropdown{
display:none;
position:absolute;
margin-left:9%;
}
li:hover .vdropdown{display:block}
</style>
</head>
<body>
<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">About</a>
<ul class="vdropdown">
<li class="vdropdown"><a href="#">History</a></li>
<li class="vdropdown"><a href="#">Team</a></li>
<li class="vdropdown"><a href="#">Offices</a></li>
</ul>
</li>
<li><a href="#">Services</a>
<ul class="vdropdown">
<li class="vdropdown"><a href="#">Web Design</a></li>
<li class="vdropdown"><a href="#">Internet Marketing</a></li>
<li class="vdropdown"><a href="#">Hosting</a></li>
<li class="vdropdown"><a href="#">Domain Names</a></li>
<li class="vdropdown"><a href="#">Broadband</a></li>
</ul>
</li>
<li><a href="#">Contact Us</a>
<ul class="vdropdown">
<li class="vdropdown"><a href="#">United Kingdom</a></li>
<li class="vdropdown"><a href="#">France</a></li>
<li class="vdropdown"><a href="#">USA</a></li>
<li class="vdropdown"><a href="#">Australia</a></li>
</ul>
</li>
</ul>
</body>
</html>It works, except the submenus appear at the bottom of the <li> hovered to activate them, instead of starting at the same level as the <li>.
__________________
Warning: My posts may change (dramatically) within the first 15 minutes they're posted. Got 'Nux?—GNU/Linux and other free software support. It's GNU/Linux, not just Linux. |
|
|
|
|
|
#2 |
|
Programming Guru
![]() ![]() |
heh, i coded something like that i while back, i posted it over here:
http://programmingforums.org/forum/s...ead.php?t=1268
__________________
Profanity is the one language that all programmers understand. Check out my Blog <---updated Nov 30 2007! |
|
|
|
![]() |
| Bookmarks |
| Currently Active Users Viewing This Thread: 1 (0 members and 1 guests) | |
| Thread Tools | |
| Display Modes | |
|
|