2011-01-05 10 views
0

Ich habe zwei divs auf einer Seite und einer von ihnen ist auf der rechten Seite. Ich habe eine Mindestbreite für das Div gesetzt, das nicht schwebt. Wenn ich mein Browser-Fenster verkleinere, dringt das schwebende div wie erwartet auf das nicht-schwebende div ein, geht aber über die minimale Breite hinaus und beginnt, den gesamten Text im nicht-schwebenden div nach unten zu schieben. Wie kann ich verhindern, dass sich das schwebende Div an einem bestimmten Punkt bewegt? Ich habe den Beispielcode unten eingefügt.CSS - Float & Resizing Windows

<html> 
<head> 
<style type="text/css"> 

#one 
{ 
    border: 1px red dotted; 
    margin-right: 500px; 
    min-width: 250px; 
} 

#two 
{ 
    border: 1px red dotted; 
    float: right; 
    width: 450px; 
} 

</style> 
</head> 

<div id="container"> 

<div id="two"> 
    This is a floating div. 
</div> 

<div id="one"> 
    This div is not floating and has a whole bunch of text inside of it. 
</div> 

</div> 
</html> 

Antwort

2

Ah, ich habe es herausgefunden! Ich setze auch eine minimale Breite auf das Container-Div auf und das Floating-Div stoppt die Bewegung, sobald das Browser-Fenster die minimale Breite dieses Container-Div erreicht.

1

Machen Sie einen Wrap <div>:

<div id="wrap"> 
    <div id="list_events"></div> 
    <div id="right_content"></div> 
</div> 

dann tun:

#wrap { 
    min-width: 600px; 
} 

min-width Einstellung wird es tun.