Basti-sama’s Blog » Web-Union

Am heutigen Samstag gab es einige Änderungen an meinem Blog. Aus Basti-sama’s Blog wird ab sofort Web-Union.de – der Webentwickler Blog (by Basti-sama) und hat außerdem eine eigene TLD bekommen: web-union.de. Ansonsten bleibt alles beim alten: Gleicher Author, gleiche Themen und gleiches WordPress.

Nebenbei habe ich auch ein wenig am Design der Seite gefeilt und die Breite von 820 auf 990 Pixel vergrößert. Dadurch bekommt der Inhalt deutlich mehr Platz erleichtert hoffentlich das Lesen. Einge Design-Mankos wurden ebenfalls ausgemerzt.

Und jetzt viel Spaß mit meinem neuen alten Blog 😉

display: inline-block; Internet Explorer

Die CSS-Eigenschaft display: inline-block; wird im Internet Explorer 6 und im Internet Explorer 7 eigentlich nicht unterstützt, aber mit einem kleinen Trick lässt sich diese Eigenschaft trotzdem darstellen.

View Code HTML5
<div class="inline_block">Diese beiden Blöcke sind nebeneinander angeordnet...</div>
<div class="inline_block">...und haben trotzdem eine feste Breite.</div>
View Code CSS
/* Neue Browser */
div.inline_block { display: inline-block; width: 200px; border: 1px solid #000; padding: 3px; }
 
/* IE 6 und 7 */
div.inline_block { display: inline; zoom: 1; }

Im IE 6 und IE 7 wird die Eigenschaft display einfach wieder zurück auf inline gesetzt und anschließend die Eigenschaft zoom hinzugefügt. Damit wird der Internet Explorer dazu gezwungen die Microsoft-proprietäre Eigenschaft hasLayout für dieses Element auf true zu setzten. Was an dieser Stelle genau passiert ist an dieser Stelle zu kompliziert zum beschreiben, jedenfalls erzielt es den selben Effekt wie display: inline-block; in neueren Browsern. Wer mehr über hasLayout erfahren möchte, sollte sich den Artikel On having Layout zu Gemüte führen.

Eine funktionierende Demo zum obigen Beispiel gibt es natürlich auch.