|
|||
Seit IE9 Problem mit Superfish Menu
Hallo,
ich habe mit der Darstellung im IE9 ein kleines Problem. Im Superfish Menu verschwinden nachdem Mouseover im Dropdown Menü die Links. In allen anderen Browsern funktioniert es. Ich kann keinen Fehler im CSS finden. Den Fehler könnt ihr euch hier anschauen: Geßner GdbR - Garten-,Forst- und Umwelttechnik Hier mal der CSS Code: HTML-Code:
#nav_main { position:relative; margin-top:111px; margin-right: 0; text-align:left; float:right; z-index:900; border:none; background-color:#b5cb00; } *+html #nav_main { /*IE7 only*/ margin-top:-44px; } #nav_main ul li a { font-size: 14px; } #nav_main ul li li a { font-size: 12px; } /*** ESSENTIAL STYLES ***/ .sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; } .sf-menu { line-height: 1.0; } .sf-menu ul { position: absolute; top: -999em; width: 12.5em; /* left offset of submenus need to match (see below) */ } .sf-menu ul li { width: 100%; } .sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ position:relative; z-index:999; } .sf-menu li { float: left; position: relative; } .sf-menu a { display: block; position: relative; } .sf-menu li:hover ul, .sf-menu li.sfHover ul { left: 0; top: 2.5em; /* match top ul list item height */ z-index: 99; } ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top: -999em; } ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; } ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } /*** DEMO SKIN ***/ .sf-menu { float: left; margin-bottom: 0; } .sf-menu a { /*border-left: 1px solid #fff; border-top: 1px solid #CFDEFF;*/ padding: .75em 1em; text-decoration:none; } .sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/ color: #ffffff; } .sf-menu ul li ul li a, .sf-menu ul li ul li a:visited { /* visited pseudo selector so IE6 applies text colour*/ color: #ffffff; } .sf-menu li { background: #b5cb00; } .sf-menu li li { background: #648d32; } .sf-menu li li li { background: #648d32; } .sf-menu li:first-child, .sf-menu li.first-child { } .sf-menu li:last-child, .sf-menu li.last-child { } .sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { color: #def394; background-color: #4a867b; outline: 0; } .sf-menu li .separator { display: block; border-left: 1px solid #fff; border-top: 1px solid #CFDEFF; padding: .75em 1em; text-decoration:none; } /*** arrows **/ .sf-menu a.sf-with-ul { padding-right: 2.25em; min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */ } .sf-sub-indicator { position: absolute; display: block; right: .75em; top: 1.05em; /* IE6 only */ width: 10px; height: 10px; text-indent: -999em; overflow: hidden; background: url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */ } a > .sf-sub-indicator { /* give all except IE6 the correct values */ top: .8em; background-position: 0 -100px; /* use translucent arrow for modern browsers*/ } /* apply hovers to modern browsers */ a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator { background-position: -10px -100px; /* arrow hovers for modern browsers*/ } /* point right for anchors in subs */ .sf-menu ul .sf-sub-indicator { background-position: -10px 0; } .sf-menu ul a > .sf-sub-indicator { background-position: 0 0; } /* apply hovers to modern browsers */ .sf-menu ul a:focus > .sf-sub-indicator, .sf-menu ul a:hover > .sf-sub-indicator, .sf-menu ul a:active > .sf-sub-indicator, .sf-menu ul li:hover > a > .sf-sub-indicator, .sf-menu ul li.sfHover > a > .sf-sub-indicator { background-position: -10px 0; /* arrow hovers for modern browsers*/ } /*** shadows for all but IE6 ***/ .sf-shadow ul { background: url('../images/shadow.png') no-repeat bottom right; padding: 0 8px 9px 0; -moz-border-radius-bottomleft: 17px; -moz-border-radius-topright: 17px; -webkit-border-top-right-radius: 17px; -webkit-border-bottom-left-radius: 17px; } .sf-shadow ul.sf-shadow-off { background: transparent; } .sf-menu .active { background-color:#4a867b; } .sf-menu #current { background-color:#4a867b; } .superfish_clear { clear: both !important; height: 1px !important; overflow: hidden !important; font-size: 1px !important; margin: 0 !important; padding: 0 !important; } |
Sponsored Links |
|
|||
Ich kann dein Problem nicht nachvollziehen. Im IE9 alles OK.
gruß, take |
|
|||
Domain www.jumo.de
Hallo,
das Problem gibt es bei unserer Website im linken Submenü: jumo.de - Produkte Wenn man links über das Menü geht und dann darin ein wenig navigiert. |
|
|||
Zitat:
gruß, take |
|
|||
.sf-menu li:hover {
visibility: inherit; /* fixes IE7 'sticky bug' */ position:relative; z-index:999; } Nimm den z-index raus und es wird funktionieren. Grüßle, Tobias -- Webdesign mit Suchmaschinenoptimierung und Benutzerfreundlichkeit - Webdesign - Webdesign - www.design-to-use.de |
|
|||
Hi,
ich hatte folgendes gar nicht bei uns im CSS: HTML-Code:
.sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ position:relative; z-index:999; } Gruß Felix |
|
|||
Hi Felix,
OK. Lade dir mal das Beispiel von der Superfish Homepage herunter und nimm einen Diff Betrachter für dein Stylesheet und das von Superfish. Übernehme einen Unterschied nach dem anderen in das Superfish Stylesheet, bis es der Fehler auch im Superfish CSS drin ist. Bei mir war es dann die Zeile mit dem z-index. So wirst du es finden, da das Original von Superfish funktioniert. Viel Erfolg! Tobi |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Horizontales menü Nach unten aufklappbar | franjob | CSS | 3 | 24.06.2009 14:51 |
Linkverhalten im IE6 | ChOpSueY! | CSS | 19 | 19.05.2008 23:48 |
Dropdown Menu mit :hover Problem | mikeIV | CSS | 0 | 12.04.2006 17:13 |
Problem mit ie (menu liste) | Indyk | CSS | 3 | 10.04.2006 13:56 |
CSS | Problem mit dem IE | Shadow | CSS | 1 | 07.05.2005 18:51 |