Einzelnen Beitrag anzeigen
  #5 (permalink)  
Alt 31.07.2014, 09:17
Benutzerbild von etux
etux etux ist offline
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 17.09.2007
Ort: Berlin
Beiträge: 643
etux wird schon bald berühmt werden
Standard

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 Beitrag anzeigen
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>
__________________
Grüße: Emil
--------------------------------------
https://emil-webdesign.net/

Geändert von etux (31.07.2014 um 10:03 Uhr)
Mit Zitat antworten