包含其他div的水平滾動div

Question

我正在嘗試在單個行中構建3 divs

左右div包含大小爲35px的單個圖像。 中東div包含許多其他的div與水平滾動

左（35px）中間（未固定寬度，與水平滾動）右（35px）

這裏是小提琴。 http://jsfiddle.net/zddm6asz/5/

<div class="wrapper"> 
<div> 
left 
<div> 

<div> 
    <div> .... </div> 
    <div> .... </div> 
    <div> .... </div> 
    .... 
</div> 

<div> 
Right 
</div> 

</div> 

我試過這麼多，但仍無法做到這一點。 任何幫助，將不勝感激

編輯

這不是響應式設計。 中間div應該佔據行中的空間。

左右div總是固定寬度。在這種情況下，兩者都設置爲35px;

Answer 1

當您使用花車，您需要設置一個寬度使他們工作。

.middle { 
    height: 100%; 
    width: 80%; /* Width is important for floats. */ 
    float: left; 
    overflow: scroll; /* Allow scroll */ 
    white-space: nowrap; /* This will create the magic for the horizontal scroll */ 
} 

.middleInner{ 
    display: inline-block; /* No float needed for inner elements */ 
} 

JSFiddle here