Gunnar Bittersmann: float und dl funktioniert nicht richtig im ie

Beitrag lesen

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

--
„Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)