左浮動的div後右浮動DIV當寬度小

Question

例子：http://jsfiddle.net/tkKth/

當我調整我的窗口（設置.container {width:200px;}），左格出現在正確的DIV之後。有沒有辦法做到這一點與CSS，當divs左/右改變其在html文檔中的位置？ - > <div class="left">Left div</div> <div class="right">Right div</div>

感謝

Answer 1

幾年以後，Flexbox將是很好的支持，所以這可以通過以下方式實現：

.container { 
    display: flex; 
} 

.left { 
    order: 2; 
} 

.right { 
    order: 1; 
} 

Answer 2

6on你的榜樣http://jsfiddle.net/tkKth/正確的DIV是左

<div class="container"> 
<div class="right">Right div</div> 
<div class="left">Left div 
</div>​ 

對你的問題是之前的其他方式

<div class="container"> 
<div class="left">Left div</div> 
<div class="right">Right div</div> 
</div>​ 

如果。容器寬度爲< =。左側寬度爲& 。如果左側高度固定（例如36px），則可以使用具有最小設備寬度的媒體查詢：如果屏幕低於600像素，並將其添加爲.right，則首先投放第一個圖像

top:36px; /* equivalent to .left height*/ 
position:absolute;