float und dl funktioniert nicht richtig im ie

[Georg]

Hallo,
ich möchte ein Glossar mittels Definitionlist darstellen. Dabei soll der Begriff links und die Erklärung wie mit einem Tabulator rechts daneben in einer Spalte stehen. Bei Firefox funktioniert das auch wunderbar, aber beim IE nicht. Falls es ein hasLayout-Problem ist, finde ich nicht den richtigen Weg es abzustellen (sprich ich verstehe zwar die Texte, die ich im Internet dazu gefunden habe, versteh aber nicht, wie ich es umsetzen soll.)

Die URL, die ich hier angegeben habe leitet auf die Site, bei der ich dies verwenden möchte, ansonsten habe ich unten das html und css beschrieben, dass ich verwenden möchte.

<dl>
  <dt>begriff1</dt>  <dd>erklärung1<br /></dd>
  <dt>begriff2</dt>  <dd>erklärung2<br /></dd>
</dl>

dt, dd {
  display:inline;
  }

dt {
  float: left;
  width:120px;
  margin-left:60px;
  }

dd {
  clear: left;
  }

[Gunnar Bittersmann]

Hello out there!

<dl>
  <dt>begriff1</dt>  <dd>erklärung1<br /></dd>
  <dt>begriff2</dt>  <dd>erklärung2<br /></dd>
</dl>

Was sollen die 'br' da am Ende?

dt, dd {
  display:inline;
  }

dt {
  float: left;
  width:120px;
  margin-left:60px;
  }

'display: inline' für 'dt' ist unsinnig, da das durch 'float' auf 'block' gesetzt wird. [CSS2 §9.7]

dd {
  clear: left;
  }

Das 'dd' soll doch aber neben dem 'dt' stehen. Du wendest die 'clear'-Eigenschaft auf das falsche Element an. Du bist dir über die Wirkung der 'clear'-Eigenschaft nicht ganz im Klaren? Siehe [CSS@ §9.5], Beispiel mit Abbildung 9.3.

Der Grund, warum der Firefox es dennoch nebeneinander darstellt, ist, dass er die 'clear'-Eigenschaft der Spec entsprechend ignoriert: „Angewendet auf: Elemente auf Blockebene“ [CSS@ §9.5.2].

Der IE begeht den Fehler, 'clear' auch auf 'dd' anzuwenden, wenn du dafür 'display: inline' gesetzt hast.

See ya up the road,
Gunnar