MSIE-Workaround gesucht: Blockelemente nebeneinander, zentriert
Candid Dauth
- css
0 Detlef G.0 Candid Dauth0 Candid Dauth0 Ashura0 Tim Tepaße0 Ashura
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
Hallo Candid
Was ich möchte, das herauskommt, ist Folgendes, und zwar zentriert:
Bla: Blök
Bla: Blök
Wie wäre es mit:
dt {float:left;width:50%;text-align:right;}
Auf Wiederlesen
Detlef
Heißa, Detlef,
dt {float:left;width:50%;text-align:right;}
Ich sitze gerade vor dem Bildschirm und lache, wie mag das bloß gekommen sein, dass ich auf etwas solch Einfaches nicht selbst gekommen bin… ;-)
Vielen Dank!
Gautera!
Grüße aus Biberach Riss,
Candid Dauth
Heißa,
noch so ganz nebenbei fürs Archiv und so:
Das Ding hier entspricht nicht ganz dem Workaround, den ich eigentlich gesucht hatte, sondern gefällt mir umso besser.
Es wirkt sich nämlich nicht aus wie text-align:center;
, sondern mehr wie text-align:":";
, die Doppelpunkte werden also mittig ausgerichtet, nicht der gesamte Text. Das nur so nebenbei.
Gautera!
Grüße aus Biberach Riss,
Candid Dauth
Hallo Candid.
[...]
text-align:":";
, die Doppelpunkte werden also mittig ausgerichtet, nicht der gesamte Text. Das nur so nebenbei.
Dies dürfte noch kommen...
Einen schönen Dienstag noch.
Gruß, Ash*feel free*ura
Hallo Ashura,
[...]
text-align:":";
Dies dürfte noch kommen...
Das gab es schon, nur an Implementierungen mangelte es:
http://www.w3.org/TR/REC-CSS2/text.html#alignment-prop
http://www.w3.org/TR/html4/struct/tables.html#h-11.3.2
Tim
Hallo Tim.
Das gab es schon, nur an Implementierungen mangelte es:
http://www.w3.org/TR/REC-CSS2/text.html#alignment-prop
Schade eigentlich.
Ah, daher war es mir bekannt.
Einen schönen Dienstag noch.
Gruß, Ash*feel free*ura