兩個div的位置

Question

我在我的網頁中有兩個div元素，並且包含了兩個元素的CSS。

#item-browsing { 
    width: 65%; 
    height: 500px; 
    float: left; 
    position: relative; 
    min-width: 915px; 
} 

#bill-information { 
    width: 315px; 
    height: 100%; 
    float: left; 
    box-shadow: 3px -3px 11px -7px; 
} 

當我重新調整各種分辨率的瀏覽器的大小時，項目瀏覽元素就會關閉。我附上了我上面所說的屏幕截圖。

怎樣才能使用CSS我解決這個問題。

謝謝。

Answer 1

給父元素position: relative和更改與#item-browsing以下CSS。

#item-browsing { 
    height: 500px; 
    position: absolute; 
    right: 315px; /* or left */ 
    left: 0; 
    top: 0; 
    bottom: 0; 
    min-width: 915px; 
} 

順便說一下，根據這個問題有很多職位上SO。

Working Fiddle

Answer 2

只需在這兩個div上放一個包裝。像這樣：這兩種元素的

#wrapper{ 
width: [your width]; 
clear: both; 
padding: 0; 
overflow: hidden; 
} 

#item-browsing { 
    width: 65%; 
    height: 500px; 
    float: left; 
    position: relative; 
    min-width: 915px; 
} 

#bill-information { 
    width: 315px; 
    height: 100%; 
    float: left; 
    box-shadow: 3px -3px 11px -7px; 
} 

Answer 3

添加的包裝和設置它的min-width既包含div的寬度的總和：

#wrapper { 
    min-width: 1230px; 
} 

Simplified demo

Answer 4

如果瀏覽器寬度小於915（最小寬度） +315（寬度）= 1230px第二個div在右側沒有空間。