menu not working in firefox

troosters
troosters used Ask the Experts™
on
Hello I have a menu which works fine in IE, but nt in Firefox ? It just is not clickable. What is not ok ?

<ul id="menu">
					<li><br/><br/><br/><a class="current">HOME</a></li>
					<li><br/><br/><br/><a href="789456123d/aboutus.html">ÜBER UNS</a></li>
					<li><br/><br/><br/><a href="789456123d/team.html">TEAM</a></li>
					<li><br/><br/><br/><a href="789456123d/practice.html">TÄTIGKEITSGEBIETE</a></li>
					<li><br/><br/><br/><a href="789456123d/news.html">NACHRICHTEN</a></li>
					<li><br/><br/><br/><a href="789456123d/contact.html">KONTAKT</a></li>
					<div style="z-index: 99; position: relative; left:25px; top: -0px; height: 64px;"><img src="images/logo1b.png" width="300px" /></div>
				</ul>

Open in new window


and the css of menu :

#menu { height: 44px; padding: 5px 0 0 4px; }
	#menu li { float: left; font-size: 1.3em; text-transform: uppercase; }
		#menu li a { color: #ccc; margin: 0 24px 0 0; }
			#menu li a.current { color: #fff; }			
			#menu li a:hover { color: #ffcc33; font-size: 1.0em;}			

Open in new window

Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

Commented:
Without seeing it in action, along with everything else around it, it's difficult to tell... One thing that MAY be the case is having the DIV inside your UL.  That's technically not proper HTML, since only LI should be inside UL.  (You can have a DIV inside the LI, but not as a direct child of the UL)

First thing I would try is removing that DIV and putting it outside the UL like so:
<ul id="menu">
					<li><br/><br/><br/><a class="current">HOME</a></li>
					<li><br/><br/><br/><a href="789456123d/aboutus.html">ÜBER UNS</a></li>
					<li><br/><br/><br/><a href="789456123d/team.html">TEAM</a></li>
					<li><br/><br/><br/><a href="789456123d/practice.html">TÄTIGKEITSGEBIETE</a></li>
					<li><br/><br/><br/><a href="789456123d/news.html">NACHRICHTEN</a></li>
					<li><br/><br/><br/><a href="789456123d/contact.html">KONTAKT</a></li>
				</ul>
<div style="z-index: 99; position: relative; left:25px; top: -0px; height: 64px;"><img src="images/logo1b.png" width="300px" /></div>

Open in new window

If you could post a link to the site (if that's possible) it would help us debug the issue a little better.

WebDevEM
Top Expert 2013

Commented:
It looks broken, but without a validation of the page I would not even venture a guess what is wrong.  Firefox tends to be more sensitive to markup errors so it makes senses that a structure like that would have issues.

Cd&

Author

Commented:
I attached a full file.
But what do you mean by it is looks broken ?
indexf.html
screen.css
Top Expert 2013
Commented:
As I suspected, the code is not valid.  Run your markup through http://validator.w3.org/
and fix your errors.  Putting a div inside the list is the worst problem, but there are a couple of others errors as well.  The stylesheet looks okay but you are also doing inline styling and that kind of mix can be lethal to a page; and make maintenance difficult.

Cd&
Expert of the Year 2014
Top Expert 2014

Commented:
I've requested that this question be deleted for the following reason:

The question has either no comments or not enough useful information to be called an "answer".

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial