直接上代碼:

<div class="father">
    <div class="child">    
        <div></div>
    </div>
</div>

// css 這裏我用了sass
.father {
    width: 200px; height: 400px; border: 1px solid red; overflow: auto;
    .child {
        background: #ccc;
        div {
            width: 400px; height: 900px;
        }
    }
}  

獲得的結果

這裏原本想要的是 內里的child元素要跟着它的子集div的寬度變化而自動撐滿, 然則獲得的結果 則是child元素寬度與father的寬度一致, 這裏我剖析是因為 width獲得了它父元素的可視寬度. 因而想要的結果 卒!!!.
固然這裡是能夠用js來盤算最內里的寬度然後給child賦值的. 我沒有如許做是因為js的本錢要比css的本錢高許多.
然後到Stack Overflow上面搜刮我想要的答案. 這裏說一下, 程序上的題目照樣要多上Stack Overflow查靠譜許多.

.father {
    width: 200px; height: 400px; border: 1px solid red; overflow: auto;
    .child {
        background: #ccc; 
        min-width: 100%; display: inline-block; // 這裏加上這兩個屬性
        div {
            width: 400px; height: 900px;
        }
    }
} 

滾動條拖到最後面也是一樣撐開.

另有一種是 給child元素加上display:table; 屬性也是能夠的.