CSS, Java, and Firefox...O my!!!

I've been working on a new site where I work. I found a script for some nice CSS drop-down menus and decided to throw those in there. They work great in IE7...but not at all in Firefox. I am a network admin....not a web designer, so this is sorta out of my league. I've used the WC3 CSS Validator and it returns no errors. Any help or suggestions would be greatly appreciated. Here are the links:

http://scs.k12.al.us - The site
http://scs.k12.al.us/scsdrop.css - The style sheet
http://scs.k12.al.us/csshover.htc - The Java

 

Give me a few - I'm going through other threads right now.

But in the meantime, please understand that Java and JavaScript are not the same thing, and are nowhere close to being related to each other.

 

understood =) .... like i said, not a developer. You'll have to bare with me here.

 

Curious...I don't see a drop down menu at all in firefox, though it's there in IE

 

Without looking at the code (which I'd probably replace anyway) for the rotating image script, my guess is the script is what's causing the problem.

I'd re-write it myself, but I don't know if you HAVE to support Internet Explorer 5 and 5.5 though.

 

have you tried , separating the css code, e.g. external css, by separating the codes can be read by firefox because css is just a script.....

 

Ok...I've tried moving all the CSS out of the HTML and into seperate files. I got the same behavior from that. Then I tried commenting out the rotating image script, with and without CSS in the document, and got the same results there too. Because this site is for a public school system, I would love to keep it compatible with as many browsers as possible. But im really not concerned with IE5. Firefox, on the other hand, is a must. I really appreciate all the help. I've been trying to get this working for weeks now and i'm about out of ideas.

 

Then I suggest a re-write. Would you mind if I took care of the template for you this weekend (I'll make sure it works in IE 6, 7, Firefox, K-Meleon, Netcape 7+, Opera and Safari)?

 

You guys won't believe this. The problem was in the HTML.

Where I had:

<ul>
<li><h2>Home</h2></li>
<ul>
<li><a href="index.htm">Sheffield City Schools Home Page</a></li>
</ul>
</ul>

Should have been:

<ul>
<li><h2>Home</h2>
<ul>
<li><a href="index.htm">Sheffield City Schools Home Page</a></li>
</ul>
</li>
</ul>

Just a few quick changes and all will be well. Thanks for all the help. Sorry if I ruined your weekend dan

 

It's ok. I did notice the nesting error, but that was the least of my concerns with the site.

 

So what suggestions do you have for it? I realize the HTML is not exactly optimized for CSS. Is that the only thing?

 

Well for starters, you're using proprietary HTML code that's preventing the page from validating (<marquee> being one of them), tables for layout (which can prevent mobile devices like PDAs and Web enabled cell phones from displaying a page properly), and you also have too much CSS to pull off what you want. You're also inlining JavaScript and CSS code, which just increases the weight of the page and makes maintenance of the entire site a nightmare, on top of using other HTML elements for purposes other than which they were intended.

In other words, I'd scrap it and start over. I have a birthday party to attend on Saturday, but I'll be more than happy to look into a redesign using clean, valid and semantic markup when I get back from it. Just let me know.

 

Just a fast advice, never prefer design over functionality

 

Actually the two go hand in hand. But if I had to choose one over the other, I'd go with functionality since the person visiting the site comes first.

But I'd also make sure that the design also does the job it's supposed to do as much as I possibly could.