Problematik mit Verschachtelten Divs

Dieses Thema im Forum "Webdesign" wurde erstellt von PoweRanga, 23. Juli 2009 .

Schlagworte:
Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. 23. Juli 2009
    Zuletzt von einem Moderator bearbeitet: 14. April 2017
    Guten Tag,

    Ich weiß gerade nicht wie ich den Thread nennen soll

    Bild

    Mein Design besteht im Grunde aus 3 Div Elementen (im Bild rot, grün, schwarz).
    Im mittleren Div befinden sich nun die zwei blauen Div Elemente. Wie bekomme ich jetzt das pinke Element nebendran, sodass sich das grüne Div Element in der Höhe an den Inhalt des pinken und der blauen Elemente anpasst?

    Absolute Positionierung und Float fallen ja weg...
    Gibts eine Lösung ohne Tabellen?

    Vielen Dank
     
  3. 23. Juli 2009
    AW: Problematik mit Verschachtelten Divs

    Stichwort fauxcolumns -> Faux Columns · An A List Apart Article

    müsstest evtl. die beiden blauen div's nochmal in ein übergeordnetes packen, damit es funktioniert.
     
  4. 23. Juli 2009
    AW: Problematik mit Verschachtelten Divs

    Das ist ja an sich kein Problem...
    Wenn nur die blauen oder nur das pinke Element da wäre würde ich dem grünen Element "height:auto" geben und die Elemente relativ positionieren. Wenn ich aber die blauen und das pinke Element in das grüne stecke, kann ich ja jeweils nur 1 relativ positionieren, da das jeweils andere Element ja unterhalb beginnen würde...

    Durch absolute Positionierung oder float erkennt das grüne Element mit "height:auto" nicht das es größer werden soll...

    Achja die blauen stecken bereits in einem übergeordnetem Div
    Das einzige Problem ist die Anpassung des grünen Elements an die anderen...
     
  5. 23. Juli 2009
    AW: Problematik mit Verschachtelten Divs

    HTML:
    <body>
<div id="rot" style="background-color:red;">text</div>
<div id="gruen" style="background-color:green;">
 <div id="blau_rahmen" style="width:20%;float:left;">
 <div id="blau_oben" style="background-color:blue">text</div>
 <div id="blau_unten" style="background-color:blue">text</div>
 </div>
 <div id="pink" style="float:right; width:80%; background-color:#F0F;">text<br />text<br />text</div>
 <br clear="all" />
</div>

<div id="schwarz" style="background-color:black; color:white;">text</div>
</body>
    Schau mal ob das so funktioniert. Hab's nicht getestet.

    lg
     
  6. 23. Juli 2009
    AW: Problematik mit Verschachtelten Divs

    Danke danke, das "<br clear="all" />" hats gelöst ^^
     
  7. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.