展开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; 
}