Gernot Back: Button formatieren

Beitrag lesen

Hallo Schorn,

Klappt im FF und Opera auch - im IE 7 hat der Button aber immer noch große Abstände rechts und links.

Jemand eine Idee, woran das liegen könnte?

ja, der IE unterhalb der Version 8 macht BUTTON-Elemente immer anderthalb mal so breit wie es die enthaltene Textmenge eigentlich nur erfordert und verteilt je ein Viertel des Platzes, den der Text einnimmt, noch einmal als Padding-Left und -Right. Das fand die Firma Microsoft wohl mal chic.

Man kann den IE6 und den IE7 aber mit JavaScript z.B. über sog. CSS-Expressions zwingen, Buttons nicht breiter darzustellen als ein direkt hineingeschachteltes Element an Platzbedarf hat. Expressions sind zwar kein valides CSS, haben aber den Vorteil, dass vernünftige Browser sich davon dann auch nicht beeindrucken lassen.

button { *width:expression(firstChild.offsetWidth + 'px');*height:expression(firstChild.offsetHeight + 2 + 'px'); }

<button><span><img src="img/struktur/icons/ico_login.gif" width="20" height="20" alt="" />Login</span></button>

Für den IE8 sind solche Maßnahmen meines Wissensn nicht mehr erforderlich, er würde CSS-Expressions ja auch ohnehin nicht mehr verstehen, es sei denn man würde ihn mit einem META-Tag in den 7er-Modus runterschalten:

Gruß Gernot