Thank you very much .. end tab fixed. Dont know how putting a white background would fix the fact that the drop down covers whats underneath.:huh:
Printable View
Thank you very much .. end tab fixed. Dont know how putting a white background would fix the fact that the drop down covers whats underneath.:huh:
It would'nt, but there's not a problem with drop downs doing that, just my opinion. I suggested a lighter background for contrast.
You can take those links out though if you wanted.
Thanks for your support.:D Waiting for client to decide
I just installed the CSS Flyout Menu and it doesn't seem to be working. I will have lots and lots of subcategories for each state, so I really need something like this. Are there any detailed instructions besides the read me page? www.southerngenealogybooks.com
Hello
I'm French, so excuse my bad English.
I can not find help on the helpdesk zen cart French, I can therefore vousb ask for help here.
I tried "css flyout menu" and I have a concern with the arrow that starts before any tabs in zen cart home.
The arrow also goes in my pack or stands' css menu flyout But she stood above the class instead of putting his left.
I want:
> Name
But right now I:
>
Name
I just can not color the css script, I'm really sorry :frusty:
Code:
body {
behavior: url(includes/csshover.htc);
} /* WinIE behavior call */
div#nav-cat {
margin-top: 0em;
background-color: #ffffff;
width: 236px;
margin-left: auto;
margin-right: auto;
font-weight: bold;
font-size: 1.3em; width:200px;
}
div#nav-cat ul {
margin: 0em;
padding: 0em;
width: 236px;
z-index: 1000;
line-height: 14px;
border: none;
}
div#nav-cat ul.level2 {background-color: #ffffff;}
div#nav-cat ul.level3 {background-color: #ffffff;}
div#nav-cat ul.level4 {background-color: #ffffff;}
div#nav-cat ul.level5 {background-color: #ffffff;}
div#nav-cat ul.level6 {background-color: #ffffff;}
div#nav-cat li {
z-index: 1;
position: relative;
list-style: none;
margin: 0;
margin-top: 0; /* change it to whatever space you want to put space between buttons*/
border-bottom: 1px solid black; /* <---this line may help or hinder IE menu shifting issues. */
background-color: pink; /*Sets background of Menu items that DOES NOT have sub-menu's SYSTEM WIDE!!! */
}
div#nav-cat li li {
margin-left: 0em;/* This puts space between menu and sub-menu, reccomend to leave at 0 unless you have over-lapping problems. */
background-color: salmon; /* sets the background of submenu ,WITHOUT submenus, when menu is HOVERED */
}
div#nav-cat li:hover {background-color: green;} /* sets the HOVER background of any MENU item that DOES NOT have submenu items */
div#nav-cat li.submenu {background-color: blue;} /* sets the background of any menu item that DOES have submenu items */
div#nav-cat li.submenu:hover {background-color: red; width:236px; text-align: width:200px;} /*sets the HOVER background of any menu item that DOES have submenu items */
div#nav-cat li a {background-color: transparent; /*<---This will set the background color of the WHOLE MENU, EVERY LEVEL, SYSTEM WIDE!!! If you want different colors, DON'T CHANGE THIS!!! */
display: block;
padding: 0.25em 0 0.3em 0em;
text-decoration: none;
width: 100%;
color: white; /* sets the font color of the menu, SYSTEM WIDE!! In order to over-ride the font colors for the menu, and have different
colors for each level, such as font color changing when you hover, you need to remove any MENU colors referred to in your
stylesheet.css, as they over-ride this stylesheet! (includes/templates/YOUR_TEMPLATE/css/stylesheet.css) */
}
div#nav-cat ul ul {
position: absolute; top: 0; left: 100%;
display: none; z-index: 1000;
}
div#nav-cat ul.level1 li.submenu:hover ul.level2,
div#nav-cat ul.level2 li.submenu:hover ul.level3,
div#nav-cat ul.level3 li.submenu:hover ul.level4,
div#nav-cat ul.level4 li.submenu:hover ul.level5,
div#nav-cat ul.level5 li.submenu:hover ul.level6 {
display:block;width:236px;position:absolute;
}
div#nav-cat ul.level3 li.submenu:hover ul.level4 { height: 200px;overflow: scroll;}
Could you help me please?
Here is my css file stylesheet_categories_menu.css
Hi all,
i've been working on this quality mod, and am fairly happy with the result, except i've somehow managed to get the submenus to stop acting like block displays in IE. The main menu works when the pointer goes over any part of the blocks, but the submenus are almost impossible to navigate and will frustrate users.
I'm not sure how i've caused this. Works fine in Chrome and Firefox.
If anyone could take a look here
http://www.testuksi.co.uk/catalog/
and let me know how badly i've messed things up it would be greatly appreciated.
Best regards, bod
Hi all,
i figured it out, had to add the last 'li' that i'd not realised i'd need in this. And bingo.
There's still one small glitch though. When the third depth of 'ul' has a submenu too, on mouse over it shows a 2px gap between itself and the next menu item below it. Any idea why? All margins are set to 0px.Code:div#nav-cat ul ul ul li {
display:block;
width: 161px;
}
Cheers, bod