nicht angemeldet
Hallo,
Es geht um eine Möglichkeit links die auf andere Webseiten verweisen mit einem kleinen Icon (12px^2) zu kennzeichnen.
Meine Lösung dafür ist wie folgt:
<a class="extern" href="http://bla.de">mehr...</a></p>
#content a.extern {
background:url(ex_link.gif) no-repeat center right;
background-color:transparent;
padding-right:20px;
}
Über die Klasse .extern spreche ich alle externen links an und habe so eigentlich wenig Stress den gewünschten Effekt zu erzielen.
In dem Moment, wenn anstatt 'mehr...' ein Text steht, der einen Zeilenumbuch erfordert, ist das Hintergrundbild verschwunden.
Der Ausweg der mit einfällt wäre:
#content a.extern {
background:url(ex_link.gif) no-repeat center right;
background-color:transparent;
padding-right:20px;
display:block;
}
was aber einen unerwünschten Nebeneffekt erzielt...
oder aber das icon direkt im link zu refferenzieren, wir z. b. :
<a class="extern" href="http://bla.de">mehr...<img scr="ex_link.gif" height="12" width="12"></a></p>
Letztere Möglichkeit finde ich aber auch suboptimal, da sie den HTML Quelltext nicht unbedingt übersichtlicher macht.
Mit
#content a.extern {
background:url(ex_link.gif) no-repeat 'posA' 'PosB';
[...]
}
den Positionen ('posA' 'PosB') habe ich schon experimentiert, aber keine Lösung gefunden.
Gehe ich Recht in der Annahme, daß es außer Einbingung in den Link als img keine Möglickeit über CSS für inline-Elemente gibt?
Falls doch, kann mir jemand verraten wie?
Vielen Dank
Ulrich