Schwierigkeiten mit DIV-Tags im IE6

Und noch ein Darstellungsfehler ausgemerzt: Der IE6 hat die Höhe von <div>-Tags immer willkürlich interpretiert und z.B. den grauen Zusatz-Block (CSS-Klasse „postmetadata„) unter jeder Seite viel zu hoch dargestellt, wenn mehrere davon vorhanden waren. Woran es genau liegt weiß ich nicht, aber es scheint zu klappen, wenn man ihm den Style um „height:2pt“ oder ähnlich ergänzt vorlegt.

Damit scheinen auch andere IE-Versionen kein Problem zu haben, nur der FireFox stellt die Höhe dann (normgerecht!) viel zu gering dar und der Kasten stimmt dort nicht mehr.

Die Lösung ist schließlich eine zweite CSS-Datei, die nur per Kommentar-Browser-Weiche eingebunden wird. Ich habe in die header.php also wie folgt eingefügt:

Browserweiche
<!--[if IE 6]>
  <link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/style_ie6.css" type="text/css" />
<![endif]-->

Das zugehörige CSS schaut so aus:

CSS speziell für den IE6
.postmetadata {
  color: #666666;
  padding: 2px 2px 2px 4px;
  border: 1px solid #e1e1e1;
  height: 4pt;
  background-color: #f7f7f7;
  font-size:8pt;
  display:block;
}

Jetzt läuft’s in allen Browsern super.