在div上展示div在div中的位置？

Question

在http://www.gamefaqs.com/，有兩個彼此相鄰的div，內容和旁邊（投票）。當您調整窗口大小時，最終投票將被擊倒到底部，但它不會留下任何空間，並且內容會延伸到投票所在的位置。

我試圖做到這一點，但我只是從我的旁邊被打倒到的空間。

請參閱本圖片爲我的意思：http://imageshack.us/a/img37/4759/5tag.jpg

如何使它像gamefaqs上的網站？

這裏是我的CSS

.container { 
    width: 75%; 
    overflow: auto; 
    border: #FCC; 
    border-style:double; 
    margin-left:auto; 
    margin-right:auto; 
    box-sizing:border-box; 
} 

.container .content { 
    background: #FFF; 
    width: 75%; 
    padding: 15px; 
    float: left; 
    box-sizing:border-box; 
} 

.container .archive { 
    border:#3C9 thick; 
    border-style:solid; 
    background: #FFF; 
    float:left; 
    width:23%; 
    padding: 15px; 
    margin-left:15px; 
    box-sizing:border-box; 
} 

Answer 1

你必須改變你的.archive類和你.content父以不百分比，因爲他們總是適合並排側，如果他們從來沒有得到比他們的集裝箱大（ 。因爲他們將永遠留在寬度的98％

你可以做三個不同的東西來解決這個問題：

1）您可以爲這些類寬度建立靜態值。

2）您可以添加此CSS：

.container .content { 
    min-width: 600px; 
} 
.container .archive { 
    min-width: 200px; 
} 

的min-width將停止從低於設定的尺寸縮小了孩子，所以當父（.container）太小而無法容納它們的最小尺寸時，第二個div將適當下移。

3）你可以考慮使用CSS3媒體查詢和響應式設計策略：

http://line25.com/tutorials/create-a-responsive-web-design-with-media-queries