自動調整div容器的大小CSS

Question

我有一個2列，寬度爲50％，最小寬度爲500px的網頁。現在我想知道如何讓它們調整大小，以便當第二列重新定位到第一列的下面時，第一列調整大小以填充整個頁面。我無法繞過它，任何幫助都將不勝感激。下面是基本的代碼：

HTML：

<div class="column"> 
    <div id="item-1"> 
     ## 
    </div> 
</div> 
<div class="column"> 
    <div id="item-2"> 
     ## 
    </div> 
</div> 

CSS：

.column{ 
    width:50%; 
    min-width:500px; 
    float:left; 
} 

Answer 1

CSS3媒體查詢

@media screen and (max-width: 1000px) { 
    .column { width: 100%; float: none; } 
} 

的調整，你應該得到你想要的。

Answer 2

你可以做到這一點與媒體查詢：

@media all and (max-width:1000px) { 
    .column {width:100%;} 
}