Grafik bei Grafiken entfernen

[Phil Marx]

Hi!
Also, folgendes Problem: Ich habe in meiner CSS-Datei einen Ausschnitt, der hinter alle externe Links ein Symbol setzt, um Links als externe deutlich zu machen. Zur Zeit unterstützt dieses Feature zwar nur Firefox, aber des wird noch.
Nun habe ich das Problem, dass wenn ich Grafiken als Linkbeschreibung habe (<a href="externe_url.html"><img src=".." /></a>), diese auch mit einer Extern-Grafik versehen werden. Das sieht, um ehrlich zu sein, scheisse aus ;)

Ein Beispiel für den "Fehler" ist www.yubb.de -> Forenticker auf der Startseite oder auch www.yubb.de -> Buttons in der Navigation.

Der Auszug aus der CSS
--------
a[href^="http:"] {
background: url('/images/externlink.gif') 100% 50% no-repeat;
padding-right: 10px;
}

a[href^="http://yubb.de"],
a[href^="http://www.yubb.de"] {
padding-right: 0px;
}
-------

Wie kann ich das beheben?

[willie]

hallö,

Nun habe ich das Problem, dass wenn ich Grafiken als Linkbeschreibung habe (<a href="externe_url.html"><img src=".." /></a>), diese auch mit einer Extern-Grafik versehen werden. Das sieht, um ehrlich zu sein, scheisse aus ;)
Wie kann ich das beheben?

nuja, meine lösung ist bestimmt nicht weltklasse, aber auf die schnelle...
a[class="blank"] { _nobackground/nopadding setzen_ }

oder halt, falls die grafiken zb. nur innerhalb bestimmten tag-strukturen auftauchen:
tag.class a { _nobackground/nopadding setzen_ } bzw.
tag.class > a { _nobackground/nopadding setzen_ } etc.

grüße aus Leipzig
willie

[Phil Marx]

Nabend!

Anee, also Klassen definieren wollte ich auch wieder nicht, das wäre zu aufwändig...
Gibt es nicht ne globale Einstellung, die alle Grafiken davon befreit?

Ich habs schon mit allen Möglichkeiten bei img {} oder a img {} probiert, erfolglos :(

[willie]

hallö,

Anee, also Klassen definieren wollte ich auch wieder nicht, das wäre zu aufwändig...

is ja auch verständlich. deswegen dachte ich, die zweite variante funxt vielleicht. grafiken sind doch zumeist nicht im normalen text mit links belegt, sondern in speziellen divs|spans|tables. (das mit tag.class geht ja auch mit *nur* tag)

Ich habs schon mit allen Möglichkeiten bei img {} oder a img {} probiert, erfolglos :(

das hilft nich, weil du ja nicht die grafik sondern den link formatiert hast.

ps: was isn das [attribut^=wert]? das gleiche wie [attribut~=wert]?

grüße aus Leipzig
willie

[willie]

hallö nochma,

Ich habs schon mit allen Möglichkeiten bei img {} oder a img {} probiert, erfolglos :(
das hilft nich, weil du ja nicht die grafik sondern den link formatiert hast.

fixe idee (ungetestet): wenn die grafik mit position und z-index _über_ den link gelegt wird??? und dann mit margin ein entsprechend großes hintergrundbild?

grüße aus Leipzig
willie

[Cheatah]

Hi,

ps: was isn das [attribut^=wert]? das gleiche wie [attribut~=wert]?

nein. "^=" sucht am Stringanfang, "~=" verlangt einen kompletten Wert innerhalb einer leerzeichenseparierten Liste. Vrgl. http://www.w3.org/TR/2001/CR-css3-selectors-20011113/#selectors.

Cheatah

[MudGuard]

Hi,

Gibt es nicht ne globale Einstellung, die alle Grafiken davon befreit?

Wovon soll die Grafik befreit werden? Die Grafik hat ja kein Hintergrundbild, sondern der Link, der um die Grafik liegt.

Ich habs schon mit allen Möglichkeiten bei img {} oder a img {} probiert, erfolglos :(

Wie gesagt, das img ist ja nicht mit Hintergrundbild formatiert, also kann es nicht helfen, bei dem img das Hintergrundbild entfernen zu wollen.
Das Hintergrundbild ist im a-Element, also muß es auch beim a-Element entfernt werden.

Aber: Es gibt _KEINE_ Möglichkeit, ein Element anhand darin enthaltener Elemente zu selektieren.
Du wirst dich damit abfinden müssen, daß Du die betroffenen Links selbst kennzeichnest.
Ggf. reicht es dazu aus, eines der Vorfahrenelemente dieser Links zu kennzeichnen.

cu,
Andreas

[nag]

Hallo,

Gibt es nicht ne globale Einstellung, die alle Grafiken davon befreit?

keine chance:
http://www.edition-w3c.de/TR/1998/REC-CSS2-19980512/kap05.html#heading-5.1

mfg NAG