Es wundert mich schon, dass Dich so eine „Pi mal Daumen“-Lösung zufrieden stellt. Aber ich kenne ja die Aufgabengegebenheiten nicht.
Zitat:
Zitat von bogazci
Wie könnte ich das rechte DIV auf 100% Höhe setzen?
|
100% von was? Vom Viewport?
Oder soll die fixe Spalte genau so hoch sein wie die flüssige Spalte?
Nachtrag:
Hier drei einfache Beispiele, die man umbauen und ergänzen könnte. Weitere Lösungswege sind auch möglich – dazu müssten aber Aufgabestellung und -Umgebung (html-Code) bekannt sein:
HTML-Code:
<!doctype html>
<meta charset="UTF-8">
<title>bogazci :: xhtmlforum.de</title>
<style>
/* Einschliessen der Floats */
.wrap-1:before,
.wrap-1:after,
.wrap-2:before,
.wrap-2:after,
.wrap-3:before,
.wrap-3:after { content: " "; display: table; }
.wrap-1:after,
.wrap-2:after,
.wrap-3:after { clear: both; }
/* Margin neben (unter) Float */
.wrap-1 .fix { float: right; width: 300px; background-color: #ddd; }
.wrap-1 .liquid { margin-right: 300px; background-color: #eee; }
/* Negativer Margin auf Padding */
.wrap-2 { padding-right: 300px; }
.wrap-2 .fix { float: right; width: 300px; margin-right: -300px; background-color: #ddd; }
.wrap-2 .liquid { float: left; width: 100%; background-color: #eee; }
/* Negativer Margin auf Border - Simulation gleich hohen Spalten */
.wrap-3 { border-right: 300px solid #ddd; background-color: #eee; }
.wrap-3 .fix { float: right; width: 300px; margin-right: -300px; }
.wrap-3 .liquid { float: left; width: 100%; }
</style>
<h1>Zum <a href="http://xhtmlforum.de/71183-2-divs-nebeneinander-links-variabel-100-a.html">Forum-Thread</a></h1>
<h2>Margin neben (unter) Float</h2>
<div class="wrap-1">
<div class="fix">
<p>Feste Breite</p>
</div>
<div class="liquid">
<p>Flüssige Breite</p>
</div>
</div>
<h2>Negativer Margin auf Padding</h2>
<div class="wrap-2">
<div class="fix">
<p>Feste Breite</p>
</div>
<div class="liquid">
<p>Flüssige Breite</p>
</div>
</div>
<h2>Negativer Margin auf Border</h2>
<div class="wrap-3">
<div class="fix">
<p>Feste Breite</p>
</div>
<div class="liquid">
<p>Flüssige Breite</p>
</div>
</div>