css - 垂直方向ではなく水平方向に div を展開する

Question

私はdivを持っています

display:inline-block;
postion:relative;

div内で

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

horizontally内側の div の内容がオーバーフローしたら、 ではなく展開してほしいvertically。内側の div の内容は、写真のサムネイルで構成されます

Answer 1

いずれかの divに設定するだけですwhite-space: nowrap(プロパティは継承されます)。（ソース）

Sidenote : これが機能するために内部の 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;
}

Answer 2

レイZ！

オーバーフローは重要です。だからあなたのcssをただのように書くために

overflow:"hidden"

あなたが使用する必要があります

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

Answer 3

内側の div の幅とオーバーフロー x を auto に設定します

    <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/