Forum Moderators: open
I coded in xhtml and css.
Here's the html code (I apologize if I'm uploading it wrong--I couldn't find any special attach method.)
<div id="wrapper1">
<div id="navigation"><!-- Navigation bar -->
<ul>
<li class="home"><a href="#">Home</a></li>
<li class="about"><a href="#">About<!--[if gte IE 7]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<!-- Drop-down menu -->
<ul><li><a href="#">Nice Extras</a></li></ul><!-- End drop-down menu -->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="services"><a href="#">Services<!--[if gte IE 7]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]-->
<!-- Drop-down menu -->
<ul><li><a href="#">Have A Look</a></li></ul><!-- End drop-down menu -->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="howitworks"><a href="#">How It Works</a></li>
<li class="contact"><a href="#">Contact</a></li>
</ul>
</div><!-- End navigation bar -->
Here's the corresponding css code:
/* Drop-down menu styling */
#navigation li ul
{
position:absolute;
z-index:100;
visibility:hidden;
}
/* Make drop-down menus visible on hover */
#navigation li:hover ul li, #navigation li a:hover ul li /* IE6 hack */
{
visibility:visible;
border-right:none;
top:0;
left:0;
}
/* Apply to drop-down menu choices */
#navigation li:hover ul li a, #navigation li a:hover ul li a /* IE6 hack */
{
color:#000;
background-color:#f9f9f9!important;
text-align:center;
display:block;
width:7em;
height:auto;
padding:0;
position:relative;
}
/* Change color on hover */
#navigation li:hover ul li a:hover, #navigation li a:hover ul li a:hover /* IE6 hack */
{
background-color:#ccc!important;
color:#000;
}
/* IE6 hack applies to its table drop-down */
#navigation table
{
margin:-1px;
border-collapse:collapse;
position:absolute;
top:0.5em;
left:0;
z-index:100;
}
/* End navigation bar styling section */
(You may see an oddball measurement in there for IE6 coding. I'm doing trial and error placement, and haven't been able to check it in IE6 yet)
Thanks.