MSIE-Workaround gesucht: Blockelemente nebeneinander, zentriert

[Candid Dauth]

Heißa, Forum,

ich sitze jetzt seit etwa drei Stunden dabei, einen IE-Workaround nach dem anderen in mein neuestes Projekt einzubauen. Langsam arbeite ich mich vor, in Google findet sich ja doch einiges, aber bei diesem Problem weiß ich gar nicht, nach was ich suchen soll.

Ich habe also eine Definitionsliste:

<dl>  
  <dt>Bla</dt>  
  <dd>Blök</dd>  
  
  <dt>Bla</dt>  
  <dd>Blök</dd>  
</dl>

Was ich möchte, das herauskommt, ist Folgendes, und zwar zentriert:
Bla: Blök
Bla: Blök

Bestenfalls möchte ich für das dt keine Breite zuweisen müssen, aber das ist nicht so wichtig.

Für moderne Browser ist die Lösung einfach, und sie tut genau das, was ich wünsche:

dl { text-align:center; }  
dt,dd { display:inline; }  
dt:after { content:":\a0"; }  
dd:after { content:"\a"; white-space:pre; }

Nun habe ich das Problem mit dem Internet Explorer. Der kennt ja kein :after und stellt deswegen alles in einer Zeile dar:

Bla Blök Bla Blök

Und das natürlich alles noch völlig verschoben, aufgrund anderer Bugs.

Ich wähle also das Floating, belasse dt und dd als Blockelemente. Nun sind die gefloateten dts ganz links (ausnahmsweise korrekt), die dds werden im übrigen Raum neben den dts zentriert, sieht also ungefähr so aus:

Bla                Blök
Bla                Blök

Ich habe keine Ahnung, wie ich das jetzt für den MSIE so hinbekomme, dass er sich so verhält wie die anderen Browser. Die Doppelpunkte sind mir nicht so wichtig, wenn es sein muss, weise ich auch gerne eine Breite zu, aber das ganze muss eben zentriert sein.

Hat jemand eine Idee?

Gautera!
Grüße aus Biberach Riss,
Candid Dauth