html，强制元素彼此相邻，即使被滚动父元素切断

Question

我希望一系列元素在带有滚动条的窗口中彼此相邻。然而，他们继续移动到下一行。

我做了一个 js fiddle :http://jsfiddle.net/922J5/

请注意，我不知道 children 的高度。

<div id = "parent">
    <div class = "child"></div>
    <div class = "child"></div>
    <div class = "child"></div>
    <div class = "child"></div>
</div>

#parent{overflow:scroll;
        width:200px;}

.child{
    background:red;
    margin:5px;
    width:100px;
    height:100px;
    display:inline-block;
}

Answer 1

向父级添加空格nowrap

#parent{overflow:scroll;
        width:200px;
    white-space:nowrap;}

.child{
    background:red;
    margin:5px;
    width:100px;
    height:100px;
    display:inline-block;
}

更新代码。