Jump to content

CSS Menue not working on IE


me16_17

Recommended Posts

Hmm... looks like you've used W3 standard-complient code here. You should have known IE wouldn't render it! :laugh:just kidding of course. IE is quite notorious for having CSS bugs, especially older versions which have little or no support for CSS at all.Seriously though,this looks like a good solid navigation. I just looked through the source for the javascript behind it, and it took me ten minutes to realize that it's CSS-powered. That is normally good, but I'm questioning the

li:hover

readability in IE. I know i've never heard of this, although it does seem to validate. I'm sorry I've never made a drop-down navigation menu, in javascript or CSS, so I guess I won't be very helpful here. The only thing I might advise, is until someone more experianced in this helps you, opt for a javascript navigation that has worked in IE. There are scripts available if you google for them.I'm sorry I'm not much help in this case. Just ask me an HTML question sometime and I'll help ya out :)

Link to comment
Share on other sites

Hmm... looks like you've used W3 standard-complient code here. You should have known IE wouldn't render it! :laugh:just kidding of course. IE is quite notorious for having CSS bugs, especially older versions which have little or no support for CSS at all.Seriously though,this looks like a good solid navigation. I just looked through the source for the javascript behind it, and it took me ten minutes to realize that it's CSS-powered. That is normally good, but I'm questioning the
li:hover

readability in IE. I know i've never heard of this, although it does seem to validate. I'm sorry I've never made a drop-down navigation menu, in javascript or CSS, so I guess I won't be very helpful here. The only thing I might advise, is until someone more experianced in this helps you, opt for a javascript navigation that has worked in IE. There are scripts available if you google for them.I'm sorry I'm not much help in this case. Just ask me an HTML question sometime and I'll help ya out :)

lol thanks, i like the navigation and i love it in CSS so if there is any way i can modify it to make it work in IE it'd be greaton a completely different topic, I learned HTML a loooonngggg time ago (when i was like 13) and im looking at XHTML and i must just be missing it, but what can XHTML do that HTML cant? or is it just cleaner code so the new browsers work better with it but it actually does the same thing?
Link to comment
Share on other sites

Also, the website it is for gets about 45 average unique visits a day from around the world, all of which are potential or current customers, so it is pretty important that i get this working and fast because I am sure some of them are using IE, so if this CANT be made to work for IE what is the best alternative for a drop-down horizontal menue bar?

Link to comment
Share on other sites

lol thanks, i like the navigation and i love it in CSS so if there is any way i can modify it to make it work in IE it'd be greaton a completely different topic, I learned HTML a loooonngggg time ago (when i was like 13) and im looking at XHTML and i must just be missing it, but what can XHTML do that HTML cant? or is it just cleaner code so the new browsers work better with it but it actually does the same thing?

XHTML is a better structured language than HTML, related more to XML, and so it is eXstensible Hypertext Markup Language, meaning you can add new tags to your document like you can with XML.
Link to comment
Share on other sites

this is your first CSS use? this is really impressive!to use

li a:hover

just make each piece of text in your list a link, and then instead of saying

li:hover

use

li a:hover

with the same code....if that made sense. if not, let me know and I'll try again tomorrow when I have a bit more sleep :)

Link to comment
Share on other sites

Also, real quick before I log off, I do recommend you get a working solution for IE as quickly as possible. Then back-up your site to domain.com/testsite/ or something to that effect until you work out the kinks. and like I said, if you google, the javascripts are out there :)OH yay! I just remembered a great web site that may help here (CSS wise): http://www.cssplay.co.uk/. That place had everything you can do with CSS and just :wow: things I didn't know were possible until today when I saw them. There are really great menus, as well, and maybe something you can use to at least guide you the right way :)Give that a gander. The author is really a genious.

Link to comment
Share on other sites

this is your first CSS use? this is really impressive!to use
li a:hover

just make each piece of text in your list a link, and then instead of saying

li:hover

use

li a:hover

with the same code....if that made sense. if not, let me know and I'll try again tomorrow when I have a bit more sleep :)

so will this make it work in IE? and thanks!!! lol i just learned basics in css and JUST implimented it into that site. so im changing the css code here right? not making any changes to the html end of it? just changing my
  li: hover

to

li a:hover

? for some reason its just not making sense to me what we're doing lol

Link to comment
Share on other sites

That's the reason why we all love CSS. With editing of one file you edit it all and make drastic changes :) .What we are doing is that we are changing the selector of the CSS which is suppose to be changing the list. Because IE only supports :hover over links we change the selector to select only links inside a list (li a:hover) instead of selecting the list items themselves(li:hover).What's the thing that is not making scence in all of this?

Link to comment
Share on other sites

alright, more specifically:

.pdmenu li:hover ul {	visibility: visible;	display: block;	position:absolute;	z-index:1;	width:175px;	padding: 0;	margin: 0;	border:1px solid black;}

should be changed. I messed about with it myself, but I'm not quite sure what to do as I've never done this before. But that is the problem code, I believei think. i'll test before i post this.

Link to comment
Share on other sites

alright, more specifically:
.pdmenu li:hover ul {	visibility: visible;	display: block;	position:absolute;	z-index:1;	width:175px;	padding: 0;	margin: 0;	border:1px solid black;}

should be changed. I messed about with it myself, but I'm not quite sure what to do as I've never done this before. But that is the problem code, I believei think. i'll test before i post this.

ok, so i make this change to my css, then go into my html and convert the text for the buttons into links?
Link to comment
Share on other sites

"li a:hover" means the hovered link(<a>) inside a list item(<li>), not a "<li a> tag(because such tag doesn't exist to begin with). You don't need to change anything in the XHTML in order for this to work, scince CSS is "smart" enough to find his way :) .

Link to comment
Share on other sites

"li a:hover" means the hovered link(<a>) inside a list item(<li>), not a "<li a> tag(because such tag doesn't exist to begin with). You don't need to change anything in the XHTML in order for this to work, scince CSS is "smart" enough to find his way :) .

ok so all I am doing is making
.pdmenu li:hover ul {visibility: visible;display: block;position:absolute;z-index:1;width:175px;padding: 0;margin: 0;border:1px solid black;}

into

.pdmenu li a:hover ul {visibility: visible;display: block;position:absolute;z-index:1;width:175px;padding: 0;margin: 0;border:1px solid black;}

?if thats the case, then i tried it and the result is, drop downs no longer work in ANY browser instead of just IE lol

Link to comment
Share on other sites

ok so all I am doing is making
.pdmenu li:hover ul {visibility: visible;display: block;position:absolute;z-index:1;width:175px;padding: 0;margin: 0;border:1px solid black;}

into

.pdmenu li a:hover ul {visibility: visible;display: block;position:absolute;z-index:1;width:175px;padding: 0;margin: 0;border:1px solid black;}

?if thats the case, then i tried it and the result is, drop downs no longer work in ANY browser instead of just IE lol

that's how I was taking it also, and it wasn't working for me.Can someone that knows what to do give us the step-by-step of what the code should be? I think this is a learn-by-example situation.
Link to comment
Share on other sites

I was just about to have a go at this then... nothing!!Put the menu back up or paste the code here so i/we can have a look :)

basically i've gone and moved on to different options and am working on a beta menue to replace the crapy set up on that site right now, but does anyone know any way to have a drop down menue work in IE? that was essentially my problem and i would instantly replace what i am working on now with a nice clean drop down menue but i cant get one to work in IE
Link to comment
Share on other sites

wow thanks lol, i wonder why no one pointed me to that in the first palce it would have saved soooooo much of this lol

I just depends on who reads and answers your posts, the menu you were talking about is quite advanced so others might not have reached that section of the w3schools site yet.Hope this sorts the problem :)
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...