| Hover not working
|
jelly46
msg:4345731 | 12:48 pm on Jul 30, 2011 (gmt 0) |
Hello to all
Please can you help me with this css as my hover links {text-decoration: underline;} are not working.
Its used within a CMS and for the life of me the hover buttons are not working .
It works differently in IE if you click on link it will undrline after use.
Here is the CSS:
Thanks guys
#wrapper{width: 180px;}
.oNavigationList { margin: 0; padding:0;}
/*.oNavigationItemParent, .oNavigationItemCurrent, .oNavigationItemSibling { list-style-type: none; }*/
map#oSideNavigationMap { width: 100%; overflow: hidden; display: block; background: #fff; }
/*.oNavigationList { margin: 0; padding: 0; }
.oNavigationItemParent, .oNavigationItemCurrent, .oNavigationItemSibling, ul.oNavigationList li { list-style-type: none; }
ul.oNavigationList li span span
{padding:8px 8px 8px 10px; background: url("/EasySiteWeb/EasySite/StyleData/one_site_hosp/Images/menu_bg_left_nav.gif") repeat-y scroll right top #fff; border-right: 6px solid #D1D1D1; border-top: 1px solid #D1D1D1;
display: block; width:92%; }
ul.oNavigationList li { display: block; width: 100%; overflow: hidden; }*/
/*-------------------------------*/
ul.oNavigationList ul { padding:0; margin:0; } /* this is the list control for the .snv-child */
ul.oNavigationList li { list-style-type: none; padding:0; margin:0; color:#00aeef; text-decoration: none;}
/*this is to control the main .snv-toplevel-outer and .snv-child list */
ul.oNavigationList li span { display:block; }
ul.oNavigationList :link, ul.oNavigationList:visited , ul.oNavigationList:hover, ul.oNavigationList :active {text-decoration: none;}
/*-------------------------------*/
.snv-toplevel-outer { padding:8px 8px 8px 8px; background: url(bg_left_nav.gif) repeat-y right #fff; color:#00aeef; border-right: 6px solid #e9e0d7; border-top: 1px solid #e9e0d7;
display: block; margin-left:0;}
.snv-toplevel-inner {}
/*---------------Current Link ---------------- */
li.oNavigationItemCurrent {}
.snv-current-icon { }
.snv-current-outer {padding:8px 0 8px 20px; display: block; background: url(left_nav_blue_line.gif) no-repeat 5% 13px!important; }
.snv-current-inner { background: url(blue_left_nav_arrow.gif) no-repeat 150px!important; color:#999999; }
a.NavigationCurrentLink:link {text-decoration: none ;}
a.NavigationCurrentLink:visited {text-decoration: none ;}
a.NavigationCurrentLink:active {text-decoration: underline;}
a.NavigationCurrentLink:hover {text-decoration: none ;}
/*---------------Current Link Children----------------*/
li.oNavigationItemChild { }
.snv-child-icon {}
.snv-child-outer {background: url(bg_left_nav.gif) repeat-y scroll right !important; margin-left:0;}
.snv-child-inner { padding:8px 8px 8px 20px !important;
background: url(left_nav_blue_line.gif) no-repeat 5% 13px!important; border-right: 6px solid #e9e0d7; border-top: 1px solid #e9e0d7; color:#00aeef;}
.snv-path-sibling-outer {}
.snv-path-sibling-inner {}
a.NavigationChildLink:link, a.NavigationChildLink:visited { text-decoration: none !important; }
a.NavigationChildLink:hover, a.NavigationChildLink:active { background: none; text-decoration: underline !important; }
li.oNavigationItemSibling { }
.snv-sibling-icon { }
.snv-sibling-outer {}
.snv-sibling-inner { padding:8px 8px 8px 8px; background: url(bg_left_nav.gif) repeat-y right #fff; border-right: 6px solid #e9e0d7; border-top: 1px solid #e9e0d7;
display: block; margin-left:0; color:#00aeef;}
a.NavigationSiblingLink:link, a.NavigationSiblingLink:visited { text-decoration: none; }
a.NavigationSiblingLink:hover, a.NavigationSiblingLink:active { text-decoration: underline; }
/*li.oNavigationItemParent { list-style-type: none; }
.snv-parent-icon { font-size: 1.1em; font-weight: bold; line-height: 1em; padding-right: 3px; }
.snv-parent-outer { display: block; }
.snv-parent-inner { display: block; padding: 2px 5px 2px 5px; }
a.NavigationParentLink:link, a.NavigationParentLink:visited { display: block; text-decoration: none; }
a.NavigationParentLink:hover, a.NavigationParentLink:active { text-decoration: none; }*/
.oNavigationItemParentPremium { background: Blue; color: Red; }
.oNavigationItemCurrentPremium { background: Green; color: Red; }
.oNavigationItemSiblingPremium { background: Lime; color: Red; font-weight: bold; }
.oNavigationItemChildPremium { background: Yellow; color: Red; font-weight: bold; }
|
lucy24
msg:4345825 | 7:27 pm on Jul 30, 2011 (gmt 0) |
:: peering into crystal ball, which is smaller than code ::
Something is overlapping the part you're trying to hover over, so the element doesn't detect the hover. An easy diagnostic, used even by grownups, is to add something like {border: 1px solid red;} to everything in your CSS. Sometimes you have to go back and make the borders a few different colors so you can see what's what.
|
tangor
msg:4345845 | 9:32 pm on Jul 30, 2011 (gmt 0) |
Sans the HTML calling the CSS, it's a tad difficult, but I second lucy24 above... but before that, I'd start with Zero (comment out all) then add one at a time (clearing cache each time) to see where the critter fails.
|
zomby888
msg:4346910 | 12:32 am on Aug 3, 2011 (gmt 0) |
I am reading your css and hope you copy pasted it. I see little gaps here and there between the selector and ':' be aware that can lead to broken rules. I also think that some elements may overlap. Try using WebDeveloper toolbar Ctrl+Shift+F will make it easy to identify which element you hover exactly.
|
|
|
