Zwei <div>s nebeneinander "floaten"

[Konrad L. M. Rudolph]

Moin,

die lange Offlinezeit vom SelfForum schlägt anscheinend nicht nur auf den Magen sondern auch aufs Gehirn -- bei mir zumindest.

Das Problem ist schon richtig cliché: ich bekomme es nicht hin, zwei <div>-Layer auf einer Seite "gleichberechtigt" und mit einer Trennlinie dazwischen auszugeben.

Das ganze soll so aussehen:
+---------+------------------------+
' menu    | content                '
'         |                        '
'         |                        '
'         |                        '
'         |                        '
'         |                        '
'         |                        '
'         |                        '
'         |                        '
+---------+------------------------+

Wenn ich folgendes CSS verwende:

#menu { float: left; width: 30em; display: block; }
#content { border-left: 1px dashed blue; display: block; }

dann ist
1- der Border nicht rechts vom Menü, sondern links davon
2- Content fließt um das Menü herum, da dieses viel kürzer ist.

Ich kann leider nicht 'display: table-cell' verwenden (das würde das Problem erledigen), da das Layout auch im MSIE sichtbar sein sollte.

Gruß,
KonRad -