Denksportaufgabe... variable Linie unten

[Elya]

Hallo,

ich sitze den Nachmittag hier an einer Anforderung, die ich dem Kunden noch nicht ausreden konnte, die ich aber auch nicht gescheit umgesetzt bekomme:

<img src="http://www.visuelya.de/selfpics/beispiel.gif" border="0" alt="">

Diese Art Buttons sollen später dynamisch beschriftet werden. Zur Zeit steht die Grafik rechts als Hintergrundbild im a-Element, daneben mit padding der Linktext. Das Problem ist die Linie, die genau links an den Text anschließen soll und damit also eine variable Länge hat. Der Button steht in einer Tabellenzelle:

<td><a href="http://www.example.com">mehr Info</a></td>

Ich habe über border-bottom, Hintergrundbilder und border für ein umschließendes oder enthaltenes Element (span), sogar 1px-Gifs nachgedacht, komme aber zu keinem brauchbaren Ergebnis. Dem a-Element eine feste Breite und eine Hintergrundfarbe zu geben und mit ihm etwas darunterliegendes "abzudecken" zerhaut mir wieder das Konzept der variablen Länge.

Auf keinen Fall möchte ich jeden Link mit der Hand anpacken müssen, um ihn zu erzeugen. Das einzige, was ich zur Zeit überhaupt sehe, sind graphische Buttons, auch nicht wirklich variabel (die Variante serverseitig erzeugter Bilder mal außen vor gelassen, irgend jemand muß das ganze ja auch bezahlen).

Habt Ihr einen Denkanstoß für mich? Wie immer wäre ich zu tiefstem Dank verpflichtet ;-)

Gruß aus Köln-Ehrenfeld,

Elya