使用 CSS 实现水平列表滚动

我想创建一个类似于 Netflix 上看到的列表的水平滚动条。这是 html 的基本设置：

This is an image that I will use to explain my efforts:

上面的设置是我想要的：scrolling_list 有一个设定的宽度（我将其设置为 300px）。然后，在这个 div 中，我有一个列表滚动器，它将托管多个名为outer_list 的子项。上面的设置显示了 list_scroller 的宽度如何随着子级数量而扩展（1000、1300、1600 或取决于子级数量的任何值）。

不幸的是，我现在不知道如何使用 css.. 执行此操作，除非我指定 list_scroller 的宽度，否则它的宽度不会扩展（它将假定第一个子级的宽度）。相反，list_scroller 采用较短的宽度，然后子级最终水平堆叠。

谁能帮我解决这个问题吗？这是当前的CSS：

.scrolling_list {
    overflow:auto;
    overflow-y:hidden;
    position:relative;
    width:360px;
}
.list_scroller {
    position:relative;
    display:block;
    overflow-x:auto;
    overflow-y:hidden;
    padding:10px;
    height:360px;
}
.list_scroller .outer_list {
    width:260px;
    display:inline-block;
}

你走在正确的轨道上！我认为而不是设置overflow: auto; and overflow-y: hidden;，您应该将整个溢出设置为隐藏，并为 list_scroller 提供更大的宽度。像这样的事情可能会起作用：

http://jsfiddle.net/mEg7g/1/ http://jsfiddle.net/mEg7g/1/

祝你好运，我希望这会有所帮助。 ：D