Unordered List Css Layout two rows of list and sublist

I have a layout which i want to do fully in CSS.

Im having trouble centering the second list, or sublist which comes from the menu. It doesnt work in IE now, just firefox (Actually the page doesnt even show on IE, nor Opera, i dont know why). I just want it to appear centered, when im hovering the main list, not left aligned...

Here's the link, youll understand when you see it...

http://forums.xisto.com/no_longer_exists/

I also want to fix the background, (i removed the background for now) becouse when i hover the sublist items, the background becomes bigger than the div which serves as background after the main list (the sub list is absolutely positioned, but i saw it in a tutorial i think im giving the right use to it, although the layout kinda breaks a little bit when you make the text bigger).

Thanks.

Actually the page doesnt even show on IE, nor Opera, i dont know why).

It's the HTML comment in your JS (<!--) that's killing it in IE. As for why your 2nd level list isn't working, I'm not sure, but you're referencing the wrong ID in your JS - it should be navlist, not nav (but that doesn't fix it).

Lozbo,

One of the concerns that has been mentioned time and time again about Javascript is that there is a large (and getting larger) number of users who have disabled javascript, but still you insist on using it.
If you insist on using it, take notice of the approach taken by this author. He uses Javascript to HIDE the menu, and then display it on mouse-over. If someone has their javascript un-plugged, they will still see the entire range of menu choices on page load. It is only if they have javascript that the menu dropdowns are taken away.

http://forums.xisto.com/no_longer_exists/

I think this link originally came from Tyssen. Can't remember for sure.

One of the concerns that has been mentioned time and time again about Javascript is that there is a large (and getting larger) number of users who have disabled javascript, but still you insist on using it.

 

Actually Jim, using javascript is the only way to get these type of CSS dropdown menus working for IE browsers as they don't (as yet - IE7 might be different) support hover for any element other than the pseudo classes. (It's still a better option that a DHTML menu which is made up solely of javascript.) The other option is to use something like the whatever:hover, but again, it is affected if JS is turned off.

The solution is to make the links that bring up the dropdown menus go to an actual page as well where the submenu links can be accessed by those who can't see the dropdowns.

And no, I didn't provide that link you've given.

Well in the first place, that javascript is not at use, all i want is to show the layout in firefox as desired, ill deal with the js later, but thanx for that tip tyssen (about the html comment, i must have missed it, becouse it was working fine in firefox).But yes, i was about to say that, tyssen is right about the css menu, the only way to get it done is with js, the alternative could be flash but im reluctant to use it, there are bigger issues about flash than with js and i dont mind much about the people with javascript disabled, see, the people that use this site 98.57 percent has it enabled so... (statistics from google analytics, from november 19 to date: 109,440 do have it, against 1,588 which is 1.43 %, on a site that has over 8000 visitors a day).As i said, my main concern is about the css look and layout, how could i achieve that? (center the second row and maybe improve its rollover status)... Thanks again dudes!