假設(shè)有兩個(gè)div，A & ampB.

Div B被賦予了900px的寬度；

屏幕分辨率為500px

這將導(dǎo)致水平滾動(dòng)。

問題是當(dāng)我向右滾動(dòng)時(shí)，我看到DivA并不是100%。

有什么方法可以讓天后總是填滿剩余的空間？

看到圖像，

添加以下圖像以解釋問題:

嗨，現(xiàn)在給你的身體最小寬度:900像素；

像這樣

body{
min-width:900px;  // total width of your wraper as like wraper width 
}

我想你錯(cuò)過了彩車:天后的左邊

.DivA{
float: left
width: 100%
}

如果您使用CSS3 -webkit-box-flex屬性，將會(huì)有所幫助。 但問題是，它不能在所有的瀏覽器上運(yùn)行。

你不能用寬度:100%的DivA來填充空白空間嗎？而且，加上float:left；位置:相對(duì)于兩個(gè)div。

問題是:div容器沒有在窗口寬度上擴(kuò)展...divA有自動(dòng)寬度，所以它將擴(kuò)展到容器寬度，網(wǎng)格div的最小寬度大于窗口寬度(我認(rèn)為...在代碼中看不到)

我的回答是:

Html:

<h1>Child Expand Test</h1>
<form action="#">
    <div class="divContainer">
        <div class="divA">
            &nbsp;
        </div> 

        <div class="divGrid">
            &nbsp;
        </div>
    </div>
</form>

CSS: 表單{ /*只是為了顯示表單不會(huì)展開，如果您需要展開它/ /將答案行移動(dòng)到此類*/ 背景色:銀色； 墊頂:1em 墊底:1em }

.divContainer {
    display: inline-block; /* this is the answer line, to expand over the window width */
}

.divA { /* this div will expand over the window width */
    background-color: red;
}

.divGrid {
    background-color: blue;
     min-width: 1500px; /* This is the reason why its needed, yo expand one child width over the size of the window */
}

這里有一把小提琴:http://jsfiddle.net/bjb7drdm/