Drop down lists - cant get working!!

[designer-drew]

Hi I just uploaded a site at www.designer-drew.com/bathbmx to www.bathbmx.com and the drop down lists don't work on "photos" and "race dates" any ideas why? and can I change to work with that server? codes for it are

 <div class="menu2">
<ul>
<li class="track specs"><a href="trackspecs.html">Track Specs</a></li>
<li class="photos"><a href="#nogo">Photos </a>
 
	<ul>
	<li class="subprod1"><a href="reg2009-1.html">Bath Regional 2009</a></li>
	<li class="subprod1"><a href="oldskool-1.html">Old Skool 80's</a></li>
	<li class="subprod2"><a href="track_build.html">Track Building</a></li>
	<li class="subprod2"><a href="practice.html">Practice Sessions</a></li>
	</ul>
</li>
<li class="services"><a href="#nogo">Race Dates 
 </a>
 
	<ul>
	<li class="subserv4"><a href="swregional.html">South-West BMX Regionals 2010</a></li>
	<li class="subserv3"><a href="nationals.html">British BMX Nationals 2010</a></li>
	</ul>
</li>
<li class="contact"><a href="sessions.html">Practice Sessions</a></li>
<li class="sitemap"><a href="http://www.designer-drew.com/bmxforum">Talk Forum</a></li>
<li class="news"><a href="membership.html">Membership</a>
<li class="news"><a href="rivaltracks.html">Rival Tracks</a>
<li class="news"><a href="business.html">Business Links</a></li>
</ul>
</div>	
	<div id="link_2"><a href="videos.html">View Videos...</a> </div>
	<div id="link_3"><a href="messages.html">Read More...</a> </div>
  </div>

Thanx Drew

[stonedeft]

you might as well need to post your css

[designer-drew]

It works fine in firefox, here the css for the lists

/* style for fly out menu */
.menu2{
	width:224px;
	height:307px;
	position: absolute;
	margin:30px 0;
	z-index:100;
	left: 47px;
	top: 94px;
}
.menu2 ul {
padding:0; margin:0; list-style-type: none; background:transparent; width:100px; height:180px; 
}
.menu2 ul li ul {
visibility:hidden; position:absolute; height:0; overflow:hidden; top:0px; left:118px;
}
.menu2 ul li {
float:left;
}
.menu2 ul li a, .menu2 ul li a:visited {
display:block; float:left; text-decoration:none; color:#000; width:120px; height:30px; line-height:29px; background:transparent; padding-left:10px;
}
* html .menu2 ul li a, * html .menu2 ul li a:visited {width:100px; w\idth:140px;}

.menu2 table {
border-collapse:collapse; border:0; margin:0; padding:0; font-size:1em; position:absolute; left:0; top:0;
}

/* first line for IE7 and non-IE browsers - second line for IE5.5 and IE6 */
.menu2 ul li:hover a,
.menu2 ul li a:hover{
background:transparent; color:#fff;
}

.menu2 ul li:hover {position:relative; z-index:90;}
* html .menu2 ul li a:hover {position:relative; z-index:100;}

.menu2 ul li:hover ul,
.menu2 ul li a:hover ul {
visibility:visible; position:absolute; height:auto; background:transparent  ; overflow:visible;
}
.menu2 ul li:hover ul li a,
.menu2 ul li a:hover ul li a{
display:block; background:transparent; color: #FFFFFF; line-height:15px; padding:5px 0 5px 10px; height:auto; text-decoration:none;
}

.menu2 ul li:hover ul li:hover a,
.menu2 ul li a:hover ul li a:hover {
background:transparent; color: #00FFFF;
}
.menu2 ul li:hover ul li ul,
.menu2 ul li a:hover ul li a ul {
visibility:hidden; position:absolute; height:0; overflow:hidden; top:0; left:85px;
}
.menu2 ul li:hover ul li:hover ul,
.menu2 ul li a:hover ul li a:hover ul {
visibility:visible; position:absolute; height:auto; color:#000; padding:0; border:none; list-style-type:none; background:transparent;
}
.menu2 ul li:hover ul li:hover ul li a,
.menu2 ul li a:hover ul li a:hover ul li a {
display:block; background:transparent; color:#fff;
}

.menu2 ul li:hover ul li:hover ul li:hover a,
.menu2 ul li a:hover ul li a:hover ul li a:hover {
background:transparent; color:#000;
}
ul#maincon2{
width:700px;
}
ul#maincon2 li.clearfix {


padding:0 20px 30px 10px;
}
ul#maincon2 li.clearfix p{
color: #666666;
display:inline;
margin-top:10px;

}
ul#maincon2 li.clearfix img{
margin: -10px 10px 0px 0px;
float:left;
display:inline;

}

[Paul O'B]

If you are taling about IE7/8 then its because of your unparsed php cpmments at the top of the page.

<?php
include('php.countdown.v1.5.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Anything above the doctype will throw IE into quirks mode and in quirks mode in quirks mode doesn't understand hover on anything except anchors.

Remove or move the php code so that is is not above the doctype. There should be nothing above the doctype at all.

It still won't work in IE6 though because IE6 only supports hover on anchors and you don;t have any helper script in place or any other alternatives - except some nonsense code that won't work.

e.g. this is nonsense as uls can't be nested inside anchors.

.menu2 ul li a:hover ul ........

I'm guessing that at one time you were probably using Stu Nichol's method but you seem to have lost all the conditional comments in the html that make it work

[designer-drew]

How silly of me, it was a php page before I found out the server didn't support it, that's it sorted.
I leave messy code around sometimes, bad practice, just being lazy.....

Regards Drew