Solved

menu not working in firefox

Posted on 2014-02-25
6
364 Views
Last Modified: 2014-03-26
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

0
Comment
Question by:troosters
6 Comments
 
LVL 9

Expert Comment

by:WebDevEM
Comment Utility
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
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
Comment Utility
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&
0
 

Author Comment

by:troosters
Comment Utility
I attached a full file.
But what do you mean by it is looks broken ?
indexf.html
screen.css
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 500 total points
Comment Utility
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&
0
 
LVL 58

Expert Comment

by:Gary
Comment Utility
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".
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

This article offers some helpful and general tips for safe browsing and online shopping. It offers simple and manageable procedures that help to ensure the safety of one's personal information and the security of any devices.
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now