Problem mit drop down-Menü

  • Hallo zusammen,

    nachdem mir bei meinem letzten großen Problem hier so fantastisch geholfen wurde, wende ich mich heute leider wieder mit einem dicken Problem an Euch, bei dem ich einfach nicht weiterkomme:

    Auf meiner Seite http://www.frank-weiberg.de habe ich oben das Menü, das ursprünglich ein Drop-down-Menü war. Nun kann man aber nichts, das nach unten "ausfährt" mehr anklicken... Hat jemand eine Idee, woran das liegen könnte?

    Die style.ccs-Datei für den Bereich sieht wie folgt aus:

    [COLOR=#008000]#header {
    background: #000;
    position: fixed;
    height: 40px;
    overflow: hidden;
    width: 100%;
    top: 0;
    }
    #logo{
    width: 260px;
    float: left;
    text-align: center;
    }
    #nav-wrapper{
    position: fixed;
    width: 960px;
    margin: 0 auto;
    height: 40px;
    font-size: 1em;
    }
    #nav-left {
    width: 350px;
    float: left;
    }
    #nav-left .sf-menu{
    float: left;
    }
    #nav-right {
    width: 600px;
    float: right;
    }
    #nav-right-full{
    width: 700px;
    float: right;
    }
    #nav-right .sf-menu, #nav-right-full .sf-menu{
    float: right;
    }[/COLOR]

    Vorab schon mal vielen Dank und beste Grüße

    Frank

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Ich glaube, folgender Teil der style.css ist auch noch wichtig:
    [COLOR=#008000]
    [/COLOR][COLOR=#006400]/*** ESSENTIAL Navigation Style ***/
    .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: 10em; /* 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' */
    }
    .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: 40px; /* 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;
    }
    /*** navigation skin ***/
    .sf-menu {
    margin-bottom: 1em;
    }
    .sf-menu a {
    color: #999;
    padding: 0 15px;
    text-decoration: none;
    padding-top:13px;
    }
    .sf-menu a:focus,
    .sf-menu a:hover,
    .sf-menu a:active {
    color: #FFF;
    }
    .current-menu-item a {
    color: #FFF !important;
    }
    .sf-menu ul a:focus,
    .sf-menu ul a:hover,
    .sf-menu ul a:active { color: #CCC; background: #000 }
    .sf-menu li ul { }
    li.sfHover { }
    .sf-menu li li { background: #1B1B1B; }
    .sf-menu li li li { background: #1B1B1B }
    .sf-menu ul a { background: #000 padding: 0 15px; line-height: 35px }
    /*** arrows **/
    .sf-menu a.sf-with-ul {
    padding-right: 2.25em;
    min-width: 1px;
    }
    .sf-sub-indicator {
    position: absolute;
    display: block;
    right: .75em;
    width: 8px;
    height: 4px;
    text-indent: -999em;
    overflow: hidden;
    background: url('images/arrows-down.png');
    }
    a > .sf-sub-indicator {
    /* give all except IE6 the correct values */
    top: 1.6em;
    }
    /* 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: -8px 0px;
    }
    /* point right for anchors in subs */
    .sf-menu ul .sf-sub-indicator {
    top: 1.2em;
    width: 4px;
    height: 7px;
    background: url('images/arrows-side.png');
    }
    .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: -4px 0;
    }
    /*** shadows for all but IE6 ***/
    .sf-shadow ul {
    margin: 0 !important;
    border-right: none !important;
    border-bottom: none !important;
    background: url('images/shadow.png') no-repeat bottom right;
    padding: 0px 3px 3px !important;
    filter: alpha(opacity=95);
    -moz-opacity: 0.95;
    -khtml-opacity: 0.95;
    opacity: 0.95;
    }
    .sf-shadow ul ul { padding-left: 0 !important }
    .sf-shadow ul.sf-shadow-off { background: transparent }
    [/COLOR]
    DANKE!

  • Haha, der nächste der den Code falsch einbindet ;-)

    das geht mit [ CODE ] body { blablub } [ /CODE ] (ohne Leerzeichen) ;-)


    Code
    .sf-menu {
        line-height: 1;
    }

    suchen und die "1" ersetzen mit "2.25"! Und dann eventuell noch die Schrift ausrichten ;-)

    Einmal editiert, zuletzt von BumbleBee (1. Februar 2013 um 17:18)

  • Es hat tatsächlich funktioniert - vielen Dank! Mich wundert jedoch folgendes: Heute Nachmittag fiel mir ein, dass der Fehler erst mit der Installation des Jetpack-plugins auftrat. Ich habe also das plugin deaktiviert und der Fehler war weg. Aktivierte ich das plugin wieder, trat der Fehler wieder auf. Ist das ein bekanntes Phänomen im Zusammenhang mit Jetpack!?

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!