Alex: Linkk bei hover verschieben

Hallo,

ich habe vor einiger zeit hier mal gefragt wie man das wort (z.b. link) in so einem link ein stück nach rechts verschieben kann, wenn man mit der maus drüber geht:
-->Link (so sieht es aus wenn man mit der maus drüber ist: -->  Link)
das script dazu:
<html>
<head>
<title></title>
<style type="text/css">
<!--
a.flipl {text-decoration:none; color:black;}
a.flipl:hover {text-decoration:none; color:blue;}
a.flipl:hover span.flipsp {margin-left:10px;}
-->
</style>
</head>
<body>
<a href="#" class="flipl"><span>--></span><span class="flipsp">Fliplink1</span></a><br>
<a href="#" class="flipl"><span>--></span><span class="flipsp">Fliplink1 etwas länger</span></a><br>
<a href="#" class="flipl"><span>--></span><span class="flipsp">Fllnk1</span></a>
</body>
</html>

Das funktioniert, jezt habe ich aber statt dem textpfeil ein gif pfeil gemacht. Und jezt wo das bild statt dem text da ist funktioniert nichts mehr, und soweit ich es ausprobiert habe funktioniert die verschiebeung überhaupt nur wenn man --> nimmt oder----- also bei Buchstaben auch nicht.
Wer kann mir helfen dass es immer funktioniert??

mfg + danke

alex

  1. Hallo,

    a.flipl:hover span.flipsp {margin-left:10px;}

    nun, das sollte mit Bildern eigentlich gegen, aber versuch mal folgendes, das ist eh besser: verändere nicht die Margin sondern die Padding! Also:

    \\ a.flipl:hover span.flipsp { padding-left:10px }
    ///

    Gruß,
    KonRad -

    --
    SELF-Code: (http://emmanuel.dammerer.at/selfcode.html)
    ss:| zu:( ls:$ fo:! de:] va:| ch:? sh:) n4:# rl:? br:& js:| ie:) fl:| mo:|
    1. Hi
      danke für deine Antwort aber es funktioniert echt nur mit den --- und nicht mit Bildern und buchstaben. Ich kappier das nicht :-(

      bitte helft mir

      mfg

      ALex

  2. hallö,

    ich schätze, dass du M$IE fährst. in Mozilla und Opera funxt es (mit <img src="irgendein.bild" alt=""> statt <span>--></span>) ganz ausgezeichnet.

    ...was will mir bloß der tag <span> (ohne attribut) sagen? oder dem browser?

    grüße aus Leipzig
    willie.de

    --
    sh:( fo:| ch:? rl:° br:> n4:# ie:% mo:) ls:# va:} de:] zu:) fl:( js:| ss:(
    http://peter.in-berlin.de/projekte/selfcode/
    1. hallo

      ja ich hab den IE und da funzzt es leider nicht:(
      DAs blöde ist nur das die ganze seite mit Opera nicht wirklich gut aussieht wegen dem ganzen css (vom mir = vom anfänger) also  bringts mir nix wenn der link da geht.
      Also wer ne Idee hat soll es bitte schreiben

      mfg
       Alex

      1. Moin!

        DAs blöde ist nur das die ganze seite mit Opera nicht wirklich gut aussieht wegen dem ganzen css (vom mir = vom anfänger) also  bringts mir nix wenn der link da geht.

        ... und da hast du dir gedacht, du schaust einfach nur mit dem IE drauf, damit
        du dich nicht ärgern musst? Was sagst du denn den Besuchern deiner Seite?
        "Hey, ärgert euch nicht, nehmt den IE!" ?

        Aber mal im Ernst:
        Vergiss die (nett ausgedrückt) total überflüssigen spans,
        schau dir in SELFHTML noch einmal an, wie man CSS erstellt und
        dann packst du alle gewünschten Eigenschaften für hover in eine {...}
        Für die Sache mit den Bildern, denke mal über Listen nach!
        (geht auch ohne, aber dann wird's komplizierter)

        Gruß

        Der Hans

        1. Hallo,

          wo kann ich denn sehen welche CSS befehle im IE und in den anderen Browsern ungefähr gleich aussehen??

          Ok ich tu die spans weg und ich mach statt den Bildern nur so Auflistungspunkte davor mal sehen obs klappt.
          Meinst du das mit Listen??

          mfg
           ALex

          1. hallö nochma,

            Hallo,

            wo kann ich denn sehen welche CSS befehle im IE und in den anderen Browsern ungefähr gleich aussehen??

            mmmh, das kannst du eigentlich nur in selfhtml (ohne anspruch auf vollständigkeit!) jeweils unter "Beachten Sie:" nachlesen. ansonsten helfen dir vielleicht dienste im inetz weiter, sind mir aber nur kostenpflichtige bekannt: http://www.google.de/search?q=browserscreenshot oder du lädst dir halt alle erhältlichen runter und installierst sie http://aktuell.de.selfhtml.org/links/web_browser.htm

            Ok ich tu die spans weg und ich mach statt den Bildern nur so Auflistungspunkte davor mal sehen obs klappt.
            Meinst du das mit Listen??

            naja, noch n bissel genauer: http://selfhtml.teamone.de/css/eigenschaften/listen.htm#list_style_image - ne sehr klasse idee! funxt bestimmt!

            grüße aus Leipzig
            willie.de

            --
            sh:( fo:| ch:? rl:° br:> n4:# ie:% mo:) ls:# va:} de:] zu:) fl:( js:| ss:(
            http://peter.in-berlin.de/projekte/selfcode/
          2. hi,

            wo kann ich denn sehen welche CSS befehle im IE und in den anderen Browsern ungefähr gleich aussehen??

            beim testen in "im IE und in den anderen Browsern".

            gruss,
            wahsaga

  3. funktioniert die verschiebeung überhaupt nur wenn man --> nimmt oder----- also bei Buchstaben auch nicht.

    hi alex,
    hab' das gerade auch mal ausprobiert und finde es wirklich sehr merkwürdig, wieso (der ie) hier einen unterschied zwischen '---' und 'XXX' macht.
    aber mit etwas experimenieren ging's dann doch, sogar mit bildern:

    <style type="text/css">
    a.flipl {text-decoration:none; color:black;}
    a.flipl span {margin-left:10px;}
    a.flipl:hover {text-decoration:none; color:blue;}
    a.flipl:hover span {margin-left:30px;}
    </style>

    <a href="#" class="flipl">XXX <span>Fliplink1</span></a><br>
    <a href="#" class="flipl">XXX <span>Fliplink1 etwas länger</span></a><br>
    <a href="#" class="flipl">XXX <span>Fllnk1</span></a>

    gruß
    Ingo

    1. Wow danke :-)
      Jezt muss ich ma überlegen wie ich es dann mache weil das bild das ich hatte ist nicht so schön aber jezt weis ich wenigstens wies geht

      mfg

      aLex

    2. Moin, Ingo!

      Erst einmal die Positiva:
      Schön, dass du tanzt.
      Schön, dass du das mal bei Reichelt/Trappe gemacht hast, für die habe ich oft getanzt!
      Schön, dass du "am Wall" wieder angefangen hast, da habe ich jahrelang gearbeitet!
      Schön, dass du jetzt "richtig" tanzen lernst (hättest du auch bei Esther und mir haben können *g*).

      Dann aber ganz furchtbar:
      Warum gibst du, der es besser wissen sollte, einem Anfänger eine Lösung vor,
      die noch immer die überflüssigen (und wenn ich mir deine Philosophie anschaue auch falschen)
      <span>-Tags enthält?

      Gruß

      Der Hans

      1. Hi hans,

        Schön, dass Du Dir mal meine HP angesehen hast..;-)

        Dann aber ganz furchtbar:

        warum furchtbar?

        Warum gibst du, der es besser wissen sollte, einem Anfänger eine Lösung vor,

        (die funktioniert)

        die noch immer die überflüssigen (und wenn ich mir deine Philosophie anschaue auch falschen)
        <span>-Tags enthält?

        wieso falsch? und wieso überflüssig?
        wenn Du mal genauer in meine Änderungen des CSS schaust, wirst Du bemerken, daß ich dort dort über:
        a.flipl span {margin-left:10px;}
        a.flipl:hover span {margin-left:30px;}
        den gewünschten Effekt erzielt habe und durch die "Vererbung" der Klasse noch ein wenig code eingespart habe.

        freundliche Grüße
        Ingo