HTMLHelp Forums > Dropdown links not working in IE?

Full Version: Dropdown links not working in IE?

HTMLHelp Forums > Web Authoring > Markup (HTML, XHTML, XML)

Blue Mask Lover

Dec 8 2006, 04:21 PM

Hey guys, I have a page here I'm testing out HTML dropdown links on:

http://www.bluemasklover.co.uk/diary22.html

and for some reason all four "site" buttons work in Firefox but not in IE.

Could someone please tell me what I have to do to get them to work in both?

Thanks

BML.

dharma

Dec 8 2006, 05:24 PM

well, firs , the line:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
I advice you to put as a very first... not somewhere in the middle of the code.

maybe already this can be the reason why it makes troubles...

and its enough to put it once on the very first line, not several times a bit everywhere like you did...

the <style type=text/css>
...
...
...
</style> part is also enough to put once and put everything in it
...

and the main: you dont uses quotes...
you have: <a href=/diary.html class="daddy"> but right should be <a href="diary.html" class="daddy">
...
try to remake

...yo, and an advice...
for copyright dont use a copyright symbol, but use this: ©
...
and maybe you nshould define the charset you use for the page...
something like: <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
or <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
or <meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
or something else

Darin McGrew

Dec 8 2006, 06:04 PM

QUOTE(dharma @ Dec 8 2006, 02:24 PM)

well, firs , the line:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
I advice you to put as a very first... not somewhere in the middle of the code.

This is just a symptom of the larger issue. There are serious problems in the HTML and in the CSS that should be fixed. Some of the HTML errors come from mixing XHTML syntax into an HTML document, but there are other problems too.

QUOTE(dharma @ Dec 8 2006, 02:24 PM)

and the main: you dont uses quotes...
you have: <a href=/diary.html class="daddy"> but right should be <a href="diary.html" class="daddy">

The URL "diary.html" is not the same as the url "/diary.html", but yes, you need quotes for href="/diary.html", and it's a good idea to include them all the time, even when not strictly required.

QUOTE(dharma @ Dec 8 2006, 02:24 PM)

and maybe you nshould define the charset you use for the page...
something like: <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
or <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
or <meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
or something else

There definitely needs to be something defining the charset, preferably in the HTTP headers. For example, your server should be configured to send your documents as

CODE

Content-Type: text/html; charset=ISO-8859-1

rather than as

CODE

Content-Type: text/html

(Use whatever charset is appropriate, if ISO-8859-1 isn't the one used by your documents.)

Blue Mask Lover

Dec 9 2006, 05:52 AM

OK thanks for that... but I've now changed everything and it still doesn't work. Most of the HTML errors were because quotes were missing... most of which I've now inserted but missing quotation marks can't be the reason this doesn't work. There has to be something else going on. It only works on the FIRST "site" dropdown and not the other three, and for some reason on IE it comes out to the left whereas on FF it drops down like it should. Well, it DID, since making all these changes it's now stopped working on FF too.

How can I make it drop DOWN rather than to the side? And why do all the drop downlinks appear on one line, rather than one under the other like they used to?

pandy

Dec 9 2006, 07:22 AM

As far as I can see the id 'nav' is hardcoded in the javascript. That id is used for all the buttons, which is wrong. An id should be unique, i.e. you can only use it once in a page.
http://www.w3.org/TR/html401/struct/global.html#adef-id
You have to give the ULs different IDs and, I suppose, make the script recognize which one is hovered.

Blue Mask Lover

Dec 9 2006, 07:41 AM

OK thanks guys, I think I have it working now. One question though... in IE the drop down links now come down shifted slightly to the left, they don't appear right under the boxes like they should. They appear fine in Firefox. Can someone tell me how I can make them appear directly under the buttons so it works in both IE & FF?

Also, little issue but there's a weird pink line going down the right of the table on the left in FF (it's not there in IE). My table borders are 0 so why is it there?

Thanks.

pandy

Dec 9 2006, 08:40 AM

Do you mean to the right? I saw it to the right earlier too when you said left.

Anyway, the 10 lines of code above the DTD puts IE in quirks mode. Also, attributes like 'align' and 'language' aren't in XHTML 1.1. The CSS has errors too.

http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes
http://jigsaw.w3.org/css-validator/validat...;usermedium=all

Blue Mask Lover

Dec 9 2006, 08:45 AM

Yeah sorry, I meant to the right!

I know, my site automatically inserts those 10 lines of text. When I try removing them the entire thing stops working in FF, having them there is the only way I can keep it working in FF. *sigh*

As you've probably guessed, I don't know much about any of this coding, I copied it from a bunch of other sites and tried to change settings to make it how I wanted it to look.

Thanks for that validation link but some of it it says "error here..." but I don't know what the right way SHOULD be.

I thought I was supposed to put it in quirks mode? I had it in strict mode earlier and that didn't work.

Oddly, a lot of the bits where the validation link says there's an error have been literally copied from elsewhere, and they work on the other sites.

So to get it to the left I have to change loads? There's not just some alignment I can put in?

pandy

Dec 9 2006, 08:56 AM

I don't know, I haven't followed the whole thread, but quirks mode is what causes the misalignment in IE. How can your host's banner code, if that's what it is, make your script work in FF?

BTW, if you don't know what you are doing I don't think you should use XHTML and you should definitely not use XHTML 1.1. 1.1 SHOULD NOT ™ be served as text/html and that's what you are doing. And you have to if you want it to show up at all in IE. So don't use it.
http://www.w3.org/TR/xhtml-media-types/#summary

Blue Mask Lover

Dec 9 2006, 09:11 AM

OK, I've changed the doctype so no more XHTML.

I don't know what the deal is with the auto banner insertion, all I know is when I remove it and hit Save, the page no longer works in Firefox.

I've changed it to strict mode and the dropdowns still aren't centred. I don't get it.

pandy

Dec 9 2006, 10:20 AM

Is the banner part of the deal with you host? Otherwise I would get a little upset if I was you.

Can't help with the actual JS, because I don't undertstand it. I'm not too good with JS. But the menus are properly positioned in IE6 with the junk removed.

Blue Mask Lover

Dec 9 2006, 10:22 AM

OK, thanks. I dunno what to do now.

And yeah, the banner is an annoying add-on with my host.

Thanks for your help.

pandy

Dec 9 2006, 07:04 PM

He should inject the code after the BODY tag...

Blue Mask Lover

Dec 10 2006, 08:07 AM

He who?

OK, separate thing now:

I've got it working in FF now. Just one question - the four buttons appear squashed up. They're fine in IE. How do I get them to appear spaced out as they should, as I can't see anything wrong with the code.

Also, the first drop down is wider than the subsequent three. How can I get them all to appear the same width?

Link is here: http://www.bluemasklover.co.uk/temp/test.html

Darin McGrew

Dec 10 2006, 12:38 PM

I recommend that you start by fixing the errors reported by the HTML validator.

Blue Mask Lover

Dec 10 2006, 02:53 PM

Thanks, but most of them cannot be the problem here. That validator seems to find errors on every website, even the ones I got this source from, where it works fine.

Is there nothing you can see in the code for how I can just fix the width of this?

pandy

Dec 10 2006, 08:49 PM

QUOTE(Blue Mask Lover @ Dec 10 2006, 02:07 PM)

He who?

He who injects the pesky banner code and makes every page with it throw IE6 into Quirks Mode. AKA Mr Host, I believe.

QUOTE

Thanks, but most of them cannot be the problem here.

You can only say that if you understand how every bit works. If you did, you would be able to fix it, no?

Darin McGrew

Dec 11 2006, 02:26 AM