Hallo zusammen,
mich beschäftigt grad ein Problem mit einem DIV-Layout.
Ich möchte 2 divs innerhalb eines Container-divs darstellen. Diese sollen nebeneinander angeordnet sein. Eines davon soll eine fixe Breite haben und das andere unabhängig vom Inhalt den Rest des Containers in der Breite ausfüllen (relative Breite).
Folgender Code demonstriert die Problemstellung:
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Beschreibung der Seite</title>
</head>
<body>
<div style="width:800px; border:5px solid black">
<div style="float:left; background-color:red; width:100%">links</div>
<div style="float:right; background-color:yellow; width:50px">rechts</div>
<div style="clear:both; background-color:blue;">clear</div>
</div>
</html>
Problem bei dem Code ist, dass das DIV mit der relativen Breite von 100% das DIV mit der fixen Breite verdrängt und in die nächste Zeile schiebt. Von der Theorie her bräuchte ich für das DIV mit der relativen Breitenangabe ein Konstrukt wie "width: 100%-50px", was natürlich so nicht möglich ist.
Irgendwelche Ideen?
Danke im Voraus,
Gruß Manni