Support for CSS Flyout Menu

I installed the menu in my left column my problem is the menu moves at the middle of the page when i select a link....

how can i stop this?

Thanks:cool:

You got a link for us to look at this?

No link, the site is local on my computer and it bothers me as I don't want to go live with this problem.

I already installed your menu here and it's working fine:

http://www.bijouxpierres.com


On the site having menu trouble I use specific add ons that i don't use on the other like:

Fast easy check out which requires Css_javascript_loader

and I wonder if the Css loader is the reason of the problem, this is my best bet as your menu and this add on are both CSS related.

:yuck:

i forgot to add, viewing the page with Explorer 6 the menu doesn't move, it does move with Firefox 1.3.9...

Great mod, but I have one issue, probably of my own making. In short, I want to use a background gradient image instead of a solid color on the menu items. I'm noticing in Safari and Internet Explorer, the background image seems to get "offset". I'm sure it's a padding or margin issue, but I'm stumped.

I've attached a screenshot and my CSS. If you can spot the problem, please let me know. I'm going in circles on this one.
http://www.ruggedradiosmedia.com/background-image.jpg

HTML Code:

---

#categoriescss.leftBoxContainer {
  background-color: transparent;
  width: 175px;
  padding-bottom: 10px;
  margin-top:0px;
}

#categoriescssHeading.leftBoxHeading {
  background: url(../images/blue-background.jpg); background-repeat:repeat;
  border-bottom: 1px solid #000;
  margin-bottom: 1px;
}

#nav-cat {
  width: 175px;
  margin: 0 0 0 0px;
  background-image: url(../images/arrows/grey-button.jpg);
  background-repeat:repeat;
  font-weight:bold;
}

#nav-cat ul {
  margin: 0;
  padding: 0;
  width: 175px;
  background: url(../images/arrows/grey-button.jpg);
  background-repeat:repeat-x;
}

#nav-cat ul.level2 {background: url(../images/arrows/grey-button.jpg); background-repeat:repeat;}
#nav-cat ul.level3 {background: url(../images/arrows/grey-button.jpg); background-repeat:repeat;}
#nav-cat ul.level4 {background: url(../images/arrows/grey-button.jpg); background-repeat:repeat;}
#nav-cat ul.level5 {background: url(../images/arrows/grey-button.jpg); background-repeat:repeat;}
#nav-cat ul.level6 {background: url(../images/arrows/grey-button.jpg); background-repeat:repeat;}

#nav-cat li {
  position: relative;
  list-style: none;
  margin: 0;
  margin-top: 0px; /* change this to put space between buttons*/
  border-bottom: 1px solid #000;
  background: url(../images/arrows/grey-button.jpg); background-repeat:repeat;
}

#nav-cat li li {
  margin: 0; /* overrides the margin-top above */
}
 
#nav-cat li:hover {
  z-index: 1000;
  color:#FF0;
}

#nav-cat li a:hover {
  color: #FF0;
  background-image:url(../images/arrows/hover-button.jpg);
  background-repeat:no-repeat;
}

#nav-cat li.submenu {
  background-image: url(../images/arrows/right-arrow.gif); /* background: url(../images/arrows/right-arrow.gif) 99% 50% no-repeat; */
  background-repeat:no-repeat;
  background-position:right;
}

#nav-cat li.submenu:hover {
          background-image: url(../images/arrows/right-arrow.gif); /* background: url(../images/arrows/right-arrow.gif) 99% 50% no-repeat; */
        background-repeat:no-repeat;
          background-position:right;
}

#nav-cat li a {
  display: block;
  padding-top: 0.25em; /* Originally .25em */
  padding-right:0em;
  padding-bottom:.25em; /* Originally .25em */
  padding-left:.5em;
  text-decoration: none;
  width: 100%;
  color: #fff;
 
}

#nav-cat>ul a {
  width: auto;
}

#nav-cat ul ul {
  position: absolute;
  top: 0;
  left: 175px;
  display: none;
}

#nav-cat ul.level1 li.submenu:hover ul.level2,
#nav-cat ul.level2 li.submenu:hover ul.level3,
#nav-cat ul.level3 li.submenu:hover ul.level4,
#nav-cat ul.level4 li.submenu:hover ul.level5,
#nav-cat ul.level5 li.submenu:hover ul.level6 {
  display:block;
  border-left: 2px solid #d########3;
  background: url(../images/arrows/hover-button.jpg);
  background-repeat:repeat;
}

---

Quote:

---

viewing the page with Explorer 6 the menu doesn't move

---

IE6 had a ton of CSS bugs and shortcomings. The only reason to still be using that version is if you have a Windows 2000 operating system which is unable to run any newer IE (other modern browsers work fine on it), or you work for a company that requires all of its computers to use IE6.

I can't troubleshoot a screenshot. If you can't let us see the site directly, you'll have to wait for Get Em Fast (who knows the mod thoroughly) to show up.

Sure, the site's a work in progress, but you can check out what I'm trying to achieve at:

http://store.ruggedradios.com

Thanks for the help!

I'm getting a lot of end tag for "ul" which is not finished warnings with the WC3 Markup Validation Service. Is this normal?
Thanks

I meant:

I'm getting a lot of "end tag for "ul" which is not finished" warnings with the WC3 Markup Validation Service. Is this normal?
Thanks

www.test.soundfactory.nu