展開DIV水平不是垂直

Question

我有

display:inline-block; 
postion:relative; 

一個div內一個div

display:block; 
width:348px; 
overflow:hidden; 

當內DIV溢出的內容，我希望他們能夠擴大horizontally，不vertically。內div的內容包括照片

Answer 1

設置縮略圖的寬度和溢出-x作爲汽車的內部DIV

<div id = "outer"> 
    <div id = "inner"></div> 
    </div> 

#outer{ 
width: 400px; 
height: 300px; 
border: red thin dotted; 
} 

#inner{ 
margin: 15px; 
height: 280px; 
width: auto; 
border: green thin solid; 
overflow-x: auto; 
} 

這裏是小提琴http://jsfiddle.net/jgrgb/

Answer 2

雷ž！

溢出確實很重要。因此，爲了你的CSS代碼爲剛剛

overflow:"hidden" 

你應該使用

overflow-x: hidden; 
overflow-y: scroll; 

Answer 3

你只需要設置white-space: nowrap在任的div的（繼承屬性）。 (Source)

旁註：內部div不是必需的，以使其工作。

演示：JSFiddle

HTML

<div class="container"> 
    <div> 
     <!-- Thumbnails --> 
    </div> 
</div> 

CSS

.container { 
    display: block; 
    width: 348px; 
    overflow: hidden; 
    white-space: nowrap; 
} 

.container div { 
    position: relative; 
    display: inline-block; 
}