RETRAX: CSS zuckt...

Hallo,

ich habe bei folgendem CSS das Problem dass die Links "hochzucken" wenn man mit der Maus darüber fährt (Hover Effekt). Das Problem kann auf meiner Webseite angeschaut werden:

http://www.retrax.de/

Und zwar handelt es sich um die Navigationsleiste Oben-Mitte.

An was liegt das? Die Leiste sollte eigentlich "ruhen", auch beim darüberfahren.

Gruss

RETRAX

/* Links Liste Oben */

#navlistOben
{
margin: 0;
padding: 0 0 20px 15%;
border-bottom: 1px solid #808080;
}
#navlistOben ul, #navlistOben li
{
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
}
#navlistOben a:link, #navlistOben a:visited
{
float: left;
line-height: 14px;
font-weight: bold;
margin: 0 10px 4px 10px;
text-decoration: none;
color: #808080;
}
#navlistOben a:link#current, #navlistOben a:visited#current, #navlistOben a:hover
{
border-bottom: 4px solid #808080;
padding-bottom: 2px;
background: transparent;
color: #90bade;
}
#navlistOben a:hover { color: #90bade;
}

/* ENDE */

  1. Bei zuckt da nichts..Warum sollte es auch zucken ?

    Gruß
    Mark

  2. Moin!

    #navlistOben a:link#current, #navlistOben a:visited#current, #navlistOben a:hover
    {
    border-bottom: 4px solid #808080;
    padding-bottom: 2px;
    background: transparent;
    color: #90bade;
    }

    Da ist der Fehler in der ersten Zeile: a:link#current u.s.w. ist falsch.

    erst bei a:hover (also Maus drüber) wird der Style zugewiesen, also der Rahmen unten. Und dann "zuckt" es... Sollten das Klassen sein, hänge sie mit einem Punkt an.

    MFFG (Mit freundlich- friedfertigem Grinsen)

    fastix®

    --
    Als Freiberufler bin ich immer auf der Suche nach Aufträgen: Schulungen, Development. Auch  für seriöse Agenturen.
    1. Da ist der Fehler in der ersten Zeile: a:link#current u.s.w. ist falsch.

      erst bei a:hover (also Maus drüber) wird der Style zugewiesen, also der Rahmen unten. Und dann "zuckt" es... Sollten das Klassen sein, hänge sie mit einem Punkt an.

      Hi,

      Entschuldigung wenn ich jetzt dumm frage. Aber ich hab jetzt nicht verstanden wie ich das Problem fixe.

      Soll ich die Zeile a:link#current usw kicken?

      Gruss

      RETRAX

      1. Moin!

        Entschuldigung wenn ich jetzt dumm frage. Aber ich hab jetzt nicht verstanden wie ich das Problem fixe.

        Soll ich die Zeile a:link#current usw kicken?

        Nö. Wenn current eine ID ist, dann mach einen Klasse daraus

        <a id="current" ... > -> <a class="current" ...>

        und im stylesheet dann:

        #naviplapla a:link.current, a:visited.current, ...

        Dann musst Du aber die "unbeklassten" Links extra aufführen:

        #naviplapla a:link; a:link.current, a:visited, a:visited.current, ...

        Sinst geht das wieder nicht nicht in Ordnung. Ich weiss aber gar nicht, wozu das current gut sein soll, hab aber auch nicht tief reingeschaut, der Fehler war schnell gefunden.

        MFFG (Mit freundlich- friedfertigem Grinsen)

        fastix®

        --
        Als Freiberufler bin ich immer auf der Suche nach Aufträgen: Schulungen, Development. Auch  für seriöse Agenturen.
        1. Sinst geht das wieder nicht nicht in Ordnung. Ich weiss aber gar nicht, wozu das current gut sein soll, hab aber auch nicht tief reingeschaut, der Fehler war schnell gefunden.

          Danke!

          Aber es lag am

          border-bottom: 2px solid #808080;
          padding-bottom: 1px;

          die waren zu dicht aufeinander, da kams dann zur Collision.

          Gruss

          RETRAX

        2. Hallo fastix®,

          #naviplapla a:link; a:link.current, a:visited, a:visited.current, ...

          Ehm - ist die Notation nicht element.klasse:pseudoformat?

          David Schneider