Hallo zusammen,
ich bin gerade dabei, eine Seite für unsere Schule aufzubauen.
Leider kenne ich mich zumindest mit CSS noch wenig bis gar nicht aus, weshalb ich hier nicht weiter komme:
Bei Hover über das Main Nav Menu taucht das Submenu zwar auf, verschwindet jedoch sofort wieder, wenn man mit der Maus darüber fahren möchte.
Dieses Phänomen tritt nur auf der Startseite auf.
Auf anderen Seiten funktioniert es tadellos.
Hat jemand Ideen, wie ich den Fehler eingrenzen kann?
Habe testweise schon alle Plugins deaktiviert, hat nichts geholfen.
Hier der CSS Ausschnitt:
CSS
/*////////////////////////////////////////////////////////////////////////// 04 - Header///////////////////////////////////////////////////////////////////////*/
#header{ width: 100%; position: relative; padding: 0 0 0 0; margin: 0 0 20px 0; z-index: 100 !important;}
#header .inside{ max-width: 62.5em; margin: 0 auto; position: relative; padding: 20px 0 20px 0; background: #fff; -webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.10); -moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.10); box-shadow:0 1px 1px rgba(0, 0, 0, 0.10); border-top: 4px solid #eaeaea;}
#logo { display: inline-block; margin: 0px 0 0px 3%; float: left; padding: 0;}
#logo h1 { margin: 0 !important; line-height: 1em !important; padding: 0 !important; font-size: 1.5em; font-weight: bold; color: #555555;}
#header h1 { font-size: 1.5em; color: #555555; margin: 0;}
#header h1 a, #header h1 a:hover{ color: #555555 !important;}
/* Top level navigation */
#mainNav{ right: 3%; position:absolute; top:50%; height:20px; margin-top:-10px; font-family: Helvetica, arial, sans-serif;}
#mainNav li{ margin: 0 0 0 1.5em; display: inline-block; padding: 0;}
#mainNav ul a{ line-height: 25px; color: #8f8f8f; font-size: .75em; font-weight: bold;}
#mainNav ul ul a{ line-height: 15px; font-weight: normal; border-top: none;}
#mainNav ul li.current a,#mainNav ul li.current-cat a,#mainNav ul li.current_page_item a,#mainNav ul li.current-menu-item a,#mainNav ul li.current-post-ancestor a,.single-post #mainNav ul li.current_page_parent a,#mainNav ul li.current-category-parent a,#mainNav ul li.current-page-ancestor a,#mainNav ul li.current-category-ancestor a,#mainNav ul li.current-portfolio-ancestor a,#mainNav ul li.current-projects-ancestor a { text-decoration: none; color: #2e2e2e;}
#mainNav ul li.sfHover a,#mainNav ul li a:hover,#mainNav ul li:hover { text-decoration: none; color: #2e2e2e;}
/* Second level+ dropdowns */
#mainNav ul ul { padding: 20px 0px 0 0px !important; margin-top: -10px; background: #fff; border: 1px solid #dedede; -moz-box-shadow: 0 0px 6px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0px 6px rgba(0,0,0,0.1); box-shadow: 0 0px 6px rgba(0,0,0,0.1);}
#mainNav ul ul ul { padding-top: 20px !important; margin-left: -1.25em; margin-top: -5px;}
#mainNav ul ul li { float: none; background: none; margin: 0 5px 10px 15px !important;}
#mainNav ul ul li a { padding: 0px 0 10px 0; font-weight: normal; border: none !important;}
#mainNav ul li.sfHover ul a { color: #7b7b7b!important; }
#mainNav ul li.sfHover ul a:hover { color: #fff!important; }
/** arrow **/
#mainNav .sf-menu a.sf-with-ul { position: relative; min-width: 1px;}
.sf-sub-indicator { position: absolute; bottom: 0px; display: block; width: 100%; text-indent: -999em; overflow: hidden; z-index: 200; height: 40px;}
.sfHover .sf-sub-indicator {
bottom: -10px;}
#mainNav .sf-menu li ul .sf-sub-indicator { display: none;}
#mainNav .sf-menu li ul .sfHover .sf-sub-indicator { position: absolute; top: 0; right: -1px; left: 0; display: block;}
.sfHover a.sf-with-ul .sf-sub-indicator { height: 30px;}
.children .sf-sub-indicator { display: none;}Vielen Dank für eure Tipps
Michael