Text vertikal zentrieren trotz float:left

[Schmidt]

Bilder in einem Button sind Verzierung, kein Inhalt. Verwende deshalb eine Hintergrundgrafik.

Latsche diwes, Matthias!

Nun, ich habe deinen Hinweis mal ausprobiert:

  
<button style="width:100%;background-image: url(bsp.png);background-repeat: no-repeat;" name="Klickmich" type="button" value="Überraschung">  
			Ein längerer Beispieltext, der bei einem schmalen Fenster Ein längerer Beispieltext, der bei einem schmalen Fenster Ein längerer Beispieltext, der bei einem schmalen Fenster Ein längerer Beispieltext, der bei einem schmalen FensterEin Beispieltext.  
		</button>  

Das Hintergrundbild ist (wie es auch soll) im Hintergrund und wird von dem Text überdeckt.

Das ist in meinem Fall nicht praktikabel.

Das Bild verdeutlicht als Piktogramm was der Button bewirkt, bzw. wohin er führt. Das Bild ist in meinem Fall somit nicht nur einfache Verzierung, sondern transportiert wichtigen Inhalt. Es dient dem schnellen Erfassen und zuordnen der Funktion und somit dem möglichst intuitiven und schnellen zurechtfinden. Aus Gründen der Barrierefreiheit und zur Sicherung des eindeutigen Verständnisses, sowie zur Erklärung versehe ich den Button noch eindeutig und klar verständlich mit Text. Ich betrachte das Piktogramm somit als Inhalt.

Schreibe mir gerne noch Einwende, falls du welche hast.

Ich befürchte meinen Wunsch nicht deutlich genug formuliert zu haben:
Was ich mir wünsche ist:

Bei einzeiligem Text:
-Bild links ausgerichtet.
-Text horizontal zentriert (in etwa)
-Bild und Text vertikal zentriert auf einer Höhe (!)

Bei mehrzeiligem Text:
-Bild links ausgerichtet
-Text horizontal zentriert (in etwa)
-Text umfließt Bild in etwa wie bei float:left des Bildes

Gruß
Schmidt