IE7 und display: inline-block
Beitrag vom: 07.01.2011, 16:17:12
Und er kann’s doch!
Lange bin ich dem Irrtum erlegen, dass der IE 7 die CSS-Eigenschaft display: inline-block nicht beherrscht. Eigentlich schade dachte ich immer, denn nicht selten hätte es mir das CSS-Leben leichter gemacht, wäre da nicht der IE 7. Mit einem kleinen Trick bringt man bestimmte Elemente aber eben doch dazu sich wie inline-Blöcke zu verhalten. Der “Muster-Browser” weiß es nur nicht …
Wer normalerweise möchte, dass Block-Elemente (p, h1 usw.) sich dem Fluss der Elemente anpassen ohne Umbrüche zu erzeugen, gibt diesen Elementen folgende Anweisung mit:
Moderne Browser setzen diesen Befehl richtig um (auch der IE 8). Wer allerdings auch den 7er berücksichtigen möchte oder muss, schreibt für die betreffenden Elemente dies hier:
Mit der zoom-Eigenschaft wird im Internet Explorer das interne Attribut hasLayout aktiviert, womit ein anderes Render-Verhalten erzwungen werden kann. Zusammen mit display: inline; verhält sich das entsprechende Element so, als würde der IE 7 display: inline-block; verstehen.
Wer es genauer wissen möchte, hier steht genau beschrieben wie es funktioniert.
display: inline-block;
display: inline; zoom: 1;