• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Div soll immer die größtmögliche Größe annehmen.

Gimli

Mitglied
Ich habe volgenden Quelltext:

HTML:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS TEST</title>

<style type="text/css">
@import url("style.css");
</style>

</head>

<body>

    <div id="wrapper">
      
    <div id="left">
    
    </div>
    
    <div id="right">
    
    </div>
    
    <div id="clear">
    
    </div>
    
  </div>

</body>
</html>

Code:
* {
    margin:0px;
    padding:0px;
    border:none;
}

#wrapper {
    background-color:#999;
    min-width:600px;
    max-width:1200px;
    margin:20px auto;
}

#left {
    background-color:#F63;
    height:50px;
    float:left;
    min-width:180px;
    margin:10px 10px 10px 10px;
}

#right {
    background-color:#069;
    height:50px;
    float:right;
    min-width:390px;
    max-width:980;
    margin:10px 10px 10px 0px;
}

#clear {
    clear:both;
}

Nun möchte ich, dass die blaue Box (#right) immer das Maximum der Größe annimmt. Als immer mit 10px margin von der Orangen Box. Mir persönlich fällt dazu jetzt nichts ein, wie man es machen könnte.

PS: Ich versuche das gerade, um meine Layouts dynamischer machen zu können.
 
Hmm, ich will das aber nicht vertikal, sondern horizontal. Also der Blaue soll möglichst so groß werden, dass er mit 10px Abstand an den Orangenen ran kommt.
 
Prinzipiell würde es reichen wenn du float und min-width aus #right entfernst. #right beginnt ohne Float an der paddingkannte von #wrapper, der Ihnalt von #right weicht #left trotzdem aus (umfließt #left ).
Im IE<8 funktioniert das aber nur wenn #right kein haslayout hat.

Kurz:
#reight darf keinen BFC bilden und für den IE>8 auch kein haslayout.

Vielleicht missverstehst du min-width. Was versprichst du dir denn davon?
 
Zuletzt bearbeitet:
Zurück
Oben