nicht angemeldet
Hi!
Wunsch:
Zwei divs stehen nebeneinander, zwischen Ihnen eine senkrechte Linie. Der Inhalt des rechten div wird unter Umständen mehrzeilig sein; bei wachsender Höhe soll die Trennlinie mitwachsen. Nachfolgende Elemente sollen unterhalb dieses Konstrukts weiterfließen.
Wirklichkeit:
Verzweifeltes rumprobieren ohne den gewünschten Erfolg!
Das brauchbarste Ergebnis sieht so aus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head><title>Unbenannt</title>
<style type="text/css">
#vll,#vlr,#ftx{ vertical-align:top;padding:10px;margin:0px; }
#vll{ float:left;width:100px;text-align:right; }
#vlr{ float:left;border-left:1px solid #666; }
#ftx{ float:none; }
</style>
</head>
<body>
<div id="vll">linke Seite</div>
<div id="vlr">rechte Seite<br>zweite Zeile<br>dritte Zeile</div>
<div id="ftx">Folgetext</div>
</body>
</html>
Dabei befindet sich jedoch der Folgetext rechts vom rechten div - wie zu erwarten, wenn für das rechte div float:left angegeben ist. Nehme ich dieses float:left jedoch heraus, so explodiert die ganze Angelegenheit. Ein float:none für den Folgetext hat keinen Effekt.
Ich test mit IE 6 - mit anderen Browsern wird die Depression wahrscheinlich noch stärker!
Fällt Euch was zielführendes dazu ein?
TIA Robert