Horizontal Css Menu

[brownrl]

ok this is weird:

in Firefox, perfect, in IE 7 perfect... in IE 6 not perfect

http://hlounge.net/~oneabe

The css code has the li's floating left... so how can they not float left in IE 6... Oh wait IE is a bulocks browser...

CSS is Here: http://hlounge.net/~oneabe/stylesheet.p ... ype=screen

Any one know the secret to making IE work right? clues? I am a bit rushed and normally never use drop down menus simply because of accessibility but this client is a bit funny...


UGG I HATE IE!


Thanks a super ton for the help...

-- Rob

[Dr.CSS]

Ok a few problems... besides IE SUCKING!!

1) your code/layout in the first CSS attached to this template is scattered too much space around the calls try and tighten it up like in the rest of the CSS files...  looks like this...

div.mainmenu li {

padding: 0;
margin: 0;
float: left;
list-style-type: none;



}



.currentpage {



background: #807E2B;








}

as opposed to this...

#primary-nav ul {
  position: absolute;
  top: auto;
  display: none;
  margin: 0px;
  padding: 0px; 
}

The more white space the longer it takes to load, the fastest is compressed but it is real hard to read so the tighter the better...

2) It looks like you can try this instead...

#primary-nav{
        list-style: none;
margin: 0px;
padding: 0px;
      }

#primary-nav ul {
list-style: none;
margin: 0px;
padding: 0px;
}
#primary-nav ul {
position: absolute;
top: auto;
display: none;
}
#primary-nav ul ul {
margin-top: 1px;
margin-left: -1px;
left: 100%;
top: 0px;
}

#primary-nav li {
margin-left: 1px;
float: left;
}
#primary-nav li li {
margin-left: 0px;
margin-top: -1px;
float: none;
position: relative;
}

to replace this...

#primary-nav, #primary-nav ul {
  list-style: none;
  margin: 0px;
  padding: 0px;
}
#primary-nav ul {
  position: absolute;
  top: auto;
  display: none;
  margin: 0px;
  padding: 0px;
 
 
}
#primary-nav ul ul {
  margin: 0px;
  left: 100%;
  top: 0px;
}

#primary-nav li {
  margin-left: 0px;
  float: left;
 

}
#primary-nav li li {
  margin-left: 0px;
  margin-top: 0px;
  float: none;
  position: relative;
}

[brownrl]

nope the code you gave still works in Firefox, IE 7, but not in IE 6...

Its a display bock on the first li's that makes it run down in IE 6 where as real browsers have no issue... Opera works well too.

At this stage of the game I am not interested 100% in the micro second delays cause by spaces in the CSS.

If I was that concerned so much about speed, I wouldn't be using a Content System which makes many database calls  just to serve up basically text...


will keep googling and shotgun approaching till something works or someone here knows.

Thanks for trying though.
Rob

[brownrl]

Allright I went through and cleaned up the CSS Code to be a bit more readbable... Sorry for that..


http://hlounge.net/~oneabe

and in IE 6 the menu goes down when I would like it to go across...

http://hlounge.net/~oneabe/stylesheet.p ... ype=screen

This is the CSS. The whole part the bottom concerning the horizontal nav css cms yada yada yada is where this is happening. the cssmenu stuff I copied over from the install.

I know it has to be a display: block, float: left issue. I wish there was a tool to convert standards compliant css to IE mongoloid CSS...

Again thanks to the above for taking a stab.

-- R

[Dr.CSS]

Looks nice, lot easier to read...

try taking display:block out of the menuwrapper this may be telling IE to make it a tall block...

[brownrl]

display: block in the menuwrapper didn't do trick...

If I take the display: block out of the a tag for the primary-nav then it goes in IE 6 but messes up a lot of the other stuff.

could be some kind of clear: both;?

[Muzzy]

Hi.

Apart from the above issue, you might want to check your other page located here:
http://hlounge.net/~oneabe/index.php?page=docs-demo
The text is way out of proportion, looks like it needs finishing off.

Mike.

[Dr.CSS]

Looks like you got it, looks good in Ff and IE from here...