Frederik: Bilder vor Links einfügen

Hallo!

Ich habe mich schon immer einmal gefragt wie es manche Leute
schaffen vor jeden Link automatisch einen kleinen Pfeil zu setzen.
Ich war mir ziemlich sicher, dass das mit CSS möglich ist, kenne
aber nicht das dazu nötige Attribut.
Oder lieber mit php parsen und davor setzten?

Danke im Vorraus!

Frederik

  1. Hallo Frederick,

    Bei CSS ... schau Mal zu CSS 4 You.

    :before ist, was du suchst, Pseudoelemente ist dein Stichwort...
    http://www.css4you.de/pseudoelproperty.html

    Aber mit PHP gehts natürlich auch ;-)

    mfg

    Anschinsan

    1. Vielen Dank!

      Frederik

    2. Hallo Anschinsan,

      :before ist, was du suchst, Pseudoelemente ist dein Stichwort...
      http://www.css4you.de/pseudoelproperty.html

      Ich denke da ist eventuell noch ein Hinweis fällig, denn das besagte Pseudoelement wird vom Internet Explorer in keiner Version interpretiert wie ich von dieser Seite entnehmen kann.
      Aber ein bisschen Verschleiß ist ja immer... ;-)

      Bis dann!

      Marc Reichelt || http://www.marcreichelt.de/

      --
      Linux is like a wigwam - no windows, no gates and an Apache inside!
      SELFCode: ie:{ fl:| br:> va:} ls:< fo:} rl:( n4:( ss:) de:> js:| ch:? sh:| mo:) zu:)
      http://emmanuel.dammerer.at/selfcode.html
      1. Hallo Marc, hallo Frederik,

        Ich denke da ist eventuell noch ein Hinweis fällig, denn das besagte Pseudoelement wird vom Internet Explorer in keiner Version interpretiert wie ich von dieser Seite entnehmen kann.
        Aber ein bisschen Verschleiß ist ja immer... ;-)

        Aber man kann den Effekt ja auch anders erzielen; z.B. indem man eine Klasse für diesen Typ Link definiert, in dem das Bild als intergrundbild platziert wird. Dann gebe man dieser Klasse noch ein padding-left, breit genug damit das Hintergrundbild nicht von der Linkschrift überdeckt wird. Das hätte dann gegenüber der Pseudoklassen-Methode wohl auch den Vorteil, dass das Bild selbst ebenfalls als verlinkt erscheint.

        Gruß Gernot

        1. Hallo Gernot,

          Ich denke da ist eventuell noch ein Hinweis fällig, denn das besagte Pseudoelement wird vom Internet Explorer in keiner Version interpretiert wie ich von dieser Seite entnehmen kann.
          Aber ein bisschen Verschleiß ist ja immer... ;-)

          Aber man kann den Effekt ja auch anders erzielen; z.B. indem man eine Klasse für diesen Typ Link definiert, in dem das Bild als intergrundbild platziert wird. Dann gebe man dieser Klasse noch ein padding-left, breit genug damit das Hintergrundbild nicht von der Linkschrift überdeckt wird. Das hätte dann gegenüber der Pseudoklassen-Methode wohl auch den Vorteil, dass das Bild selbst ebenfalls als verlinkt erscheint.

          *uarghh*, also einen so miesen Workaround mache ich doch nicht extra für die Benutzer des Internet Explorers.
          Da ist mir der Standard wesentlich mehr wert. Auch wenn dieser Workaround den Standard nicht verletzt, ist er doch etwas - unschön, findest du nicht? :-)

          Bis dann!

          Marc Reichelt || http://www.marcreichelt.de/

          --
          Linux is like a wigwam - no windows, no gates and an Apache inside!
          SELFCode: ie:{ fl:| br:> va:} ls:< fo:} rl:( n4:( ss:) de:> js:| ch:? sh:| mo:) zu:)
          http://emmanuel.dammerer.at/selfcode.html
          1. Hi Marc,

            Da ist mir der Standard wesentlich mehr wert. Auch wenn dieser Workaround den Standard nicht verletzt, ist er doch etwas - unschön, findest du nicht? :-)

            Wieso? Funktioniert doch hervorragend.

            Viele Grüße
            Mathias Bigge

            1. Hi,

              Wieso? Funktioniert doch hervorragend.

              Im IE 5.0 nicht so wirklich - der macht das Padding bei inline-Elementen nicht und setzt den Text dann auf das Bild ...
              Im IE 6.0 gehts, beim IE 5.5 bin ich mir nicht sicher ...

              cu,
              Andreas

              --
              Warum nennt sich Andreas hier MudGuard?
              Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
              1. Hi,

                Im IE 5.0 nicht so wirklich - der macht das Padding bei inline-Elementen nicht und setzt den Text dann auf das Bild ...
                Im IE 6.0 gehts, beim IE 5.5 bin ich mir nicht sicher ...

                Also beim IE 5 konnte ich kein Fehlverhalten feststellen. Der 5.5 funktioniert auch. Nur der 6er hat das Problem, daß sich die Grafik unter den Text schiebt, falls der so ausgezeichnete Text gegen den linken Rand "drückt" (s. Coding: Link-Kennzeichnung.

                Gruß, Cybaer

                --
                Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
                1. hi,

                  Im IE 5.0 nicht so wirklich - der macht das Padding bei inline-Elementen nicht und setzt den Text dann auf das Bild ...
                  Im IE 6.0 gehts, beim IE 5.5 bin ich mir nicht sicher ...

                  Also beim IE 5 konnte ich kein Fehlverhalten feststellen. Der 5.5 funktioniert auch. Nur der 6er hat das Problem, daß sich die Grafik unter den Text schiebt, falls der so ausgezeichnete Text gegen den linken Rand "drückt" (s. Coding: Link-Kennzeichnung.

                  also auf http://coding.binon.net/css/linksign/linksign.htm sehe ich erwartungsgemäß genau das von andreas beschriebene problem, linktext "über" den hintergrundgrafiken.

                  gruß,
                  wahsaga

                  --
                  "Look, that's why there's rules, understand? So that you _think_ before you break 'em."
                  1. Hi,

                    also auf http://coding.binon.net/css/linksign/linksign.htm sehe ich erwartungsgemäß genau das von andreas beschriebene problem, linktext "über" den hintergrundgrafiken.

                    ist in meinem IE 5 hier auch so.

                    cu,
                    Andreas

                    --
                    Warum nennt sich Andreas hier MudGuard?
                    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
                    1. Hi,

                      ist in meinem IE 5 hier auch so.

                      Erstaunlich. Ich hatte bei meinen 5er-Tests dieses Problem nicht. Auf dem 5.5 ist es sowieso nicht existent.

                      Gruß, Cybaer

                      --
                      Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
                  2. Hi,

                    also auf http://coding.binon.net/css/linksign/linksign.htm sehe ich erwartungsgemäß genau das von andreas beschriebene problem, linktext "über" den hintergrundgrafiken.

                    Und das unterscheidet sich jetzt inwiefern von dem was ich sagte ("daß sich die Grafik unter den Text schiebt")?

                    Außer natürlich, daß ich noch weiter ausgeführt habe, daß dieses Fehlverhalten "nur" in *einer* bestimmten, *genau zu definierenden* Situation auftritt und nicht immer, wie man beim Lesen der bisherigen Antworten dazu annehmen könnte?

                    Wenn man möchte, kann man also durchaus dafür sorgen, daß diese Situation nicht eintritt. Man kann aber auch sagen, mit diesem Browserfehler kann man leben.

                    Gruß, Cybaer

                    --
                    Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
                    1. Hallo,

                      Wenn man möchte, kann man also durchaus dafür sorgen, daß diese Situation nicht eintritt. Man kann aber auch sagen, mit diesem Browserfehler kann man leben.

                      Und wie kann man das verhintern?

                      Grüße
                      Jeena Paradies

                      --
                      Pro7 macht auch Fehler
                      1. Hi,

                        Und wie kann man das verhintern?

                        Rektal.

                        cu,
                        Andreas

                        --
                        Warum nennt sich Andreas hier MudGuard?
                        Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
                        1. Hallo,

                          Und wie kann man das verhintern?
                          Rektal.

                          hehe hups, ja stimmt ;-)

                          Und wie kann man das verhindern?

                          Grüße
                          Jeena Paradies

                          --
                          Pro7 macht auch Fehler
                          1. Hi,

                            Und wie kann man das verhintern?
                            Rektal.
                            hehe hups, ja stimmt ;-)

                            Meinst Du hups oder Pups? ;-)

                            cu,
                            Andreas

                            --
                            Warum nennt sich Andreas hier MudGuard?
                            Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
                            1. Hallo,

                              Meinst Du hups oder Pups? ;-)

                              Hehe, ich konnte es mir gerade noch mit aller Mühe verkneifen aber du anscheinend nicht ;-)

                              Grüße
                              Jeena Paradies

                              --
                              Pro7 macht auch Fehler
                              1. Hi,

                                Meinst Du hups oder Pups? ;-)
                                Hehe, ich konnte es mir gerade noch mit aller Mühe verkneifen aber du anscheinend nicht ;-)

                                Es waren zu viele Zwiebeln im Abendessen ...

                                cu,
                                Andreas

                                --
                                Warum nennt sich Andreas hier MudGuard?
                                Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
                      2. Hi,

                        Wenn man möchte, kann man also durchaus dafür sorgen, daß diese Situation nicht eintritt. Man kann aber auch sagen, mit diesem Browserfehler kann man leben.
                        Und wie kann man das verhintern?

                        Den Darstellungsfehler? Er tritt nur auf, wenn, wie geschrieben, der Text an den linken Rand gedrückt wird (also wenn der Link am linken direkt am linken Rand steht und dann noch weiterer Fließtext (halt mind. bis zum rechten Rand) folgt.

                        Ergo: Entweder auf den Fließtext verzichten, oder vielleicht eine unsichtbare, etwas größere Box um den so gekennzeichneten Link ziehen (hm, das wäre ja noch glatt ein Workaround, den ich mal ausprobieren sollte).

                        Gruß, Cybaer

                        --
                        Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
                    2. hi,

                      also auf http://coding.binon.net/css/linksign/linksign.htm sehe ich erwartungsgemäß genau das von andreas beschriebene problem, linktext "über" den hintergrundgrafiken.

                      Und das unterscheidet sich jetzt inwiefern von dem was ich sagte ("daß sich die Grafik unter den Text schiebt")?

                      das unterscheidet sich vom testszenario her.

                      du sagst, du könntest im IE 5 kein fehlerverhalten feststellen, ich aber schon, s.o.

                      deine aussage hast du für den IE 6 getroffen.

                      gruß,
                      wahsaga

                      --
                      "Look, that's why there's rules, understand? So that you _think_ before you break 'em."
                      1. Hi,

                        das unterscheidet sich vom testszenario her.

                        Ah, wäre gut, das hinzuzuschreiben. =;-)

                        du sagst, du könntest im IE 5 kein fehlerverhalten feststellen, ich aber schon, s.o.

                        Da gibt es wohl unterschiedliche 5er ...

                        Gruß, Cybaer

                        --
                        Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
      2. Hallo Marc,

        Aber ein bisschen Verschleiß ist ja immer... ;-)

        Heute im Spiegel gelesen ... es sind schon nur mehr 65% laut Statistik von spiegel.de! Da kommt Freude auf ;-)

        mfg

        Anschinsan

        1. Hallo Anschinsan,

          Heute im Spiegel gelesen ... es sind schon nur mehr 65% laut Statistik von spiegel.de! Da kommt Freude auf ;-)

          Ich sag doch, ein _bisschen_ Verschleiß ist immer! *lol*

          Marc Reichelt || http://www.marcreichelt.de/

          --
          Linux is like a wigwam - no windows, no gates and an Apache inside!
          SELFCode: ie:{ fl:| br:> va:} ls:< fo:} rl:( n4:( ss:) de:> js:| ch:? sh:| mo:) zu:)
          http://emmanuel.dammerer.at/selfcode.html
          1. OK Marc,

            Schon gut, schon gut ... du hast ja Recht ... Asche über mein Haupt!
            Der Tip von Gernot ist besser!

            Anschinsan