Menu hover hides top menu item
Permalink Browser Info Environment
Using Classy-Business with Superfish. Main problem is that when a user hovers over the primary menu item, the drop-down hides that item, making the primary page impossible to visit. Try this athttp://www.orcaa.org/page-list.... None of the x-index settings seem to help solve the problem.
~Mark
~Mark
| Type: | Discussion |
|---|---|
| Status: | New |
Hello Greg -
Unfortunately, the code that Chrome spews out combines many elements in a way that does not truly represent the CSS. Adjusting top does not fix this issue. Starting to get a headache :-) I would attach the CSS file, but I am uncertain about the licensing issues with providing the sheet.
Unfortunately, the code that Chrome spews out combines many elements in a way that does not truly represent the CSS. Adjusting top does not fix this issue. Starting to get a headache :-) I would attach the CSS file, but I am uncertain about the licensing issues with providing the sheet.
Hi Mark,
Try pulling out - or commenting out the entire "Navigation" section of the classy blue theme's screen.css file.
/themes/classybusiness/screen.css
Clear your browser cache, then see where that gets you.
The problem is that this css:
is positioning the sub-menu ul at the top of it's containing list element and that's overriding superfish's positioning.
Try pulling out - or commenting out the entire "Navigation" section of the classy blue theme's screen.css file.
/themes/classybusiness/screen.css
Clear your browser cache, then see where that gets you.
The problem is that this css:
<style>
div#navigation ul {
list-style-type: none;
margin: 0;
padding: 0;
float: right;
height: 52px;
position: absolute;
top: 0;
right: 0;
}
</style>
<? ?>is positioning the sub-menu ul at the top of it's containing list element and that's overriding superfish's positioning.
Good call Ryan. Commenting out the Nav section nearly produces the results that I am looking to achieve. A little CSS revamp on the Superfish and I am in business. Thanks for that one...
I took a look at your site.
Using Chrome's "inspect element" feature I was able to get it looking better using these settings:
#sf-menu2348 .sf-menu ul.sf-submenu li {
display: block;
float: none;
height: auto;
left: 0px;
min-width: 135px !important;
position: relative;
top: 50px;
width: auto !important;
}
I only changed "top" from 0px to 50px. I wasn't able to save your site / check css etc, so I haven't checked it in IE7 yet. Let me know how it works for you.