HTML CSS中的水平滚动

Question

我有一个内容列表，想在bootstrap网格中以span9的方式显示，并且只能在x轴方向上滚动。下面是设计的快照。

但是我无法让它与...一起工作。

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

Link: http://play.mink7.com/mybooks/template.html

- Harsha M V

Answer 1

内容不会在X轴上溢出，因为它只是换到了新的一行。你可能需要使用以下方法强制内容保持在同一行:

.featured-category ul {
    white-space: nowrap;    // add
}

.featured-category ul li {
    display: inline-block;  // add
    /*float: left;*/        // remove
}

- Bazzz

---

我本来只是想建议添加inline-block，但你编辑得更快，现在我能做的就是给你一个+1；-) 做得好！^_^ - Martin Turjak

@MartinTurjak 感谢你的点赞，我最初只是根据问题的描述从脑海中想出了可能的解决方案，然后通过提供的链接检查了我的答案。显然，仅使用“nowrap”是不够的，我发现还需要使用“inline-block”。你的建议也是正确的。 - Bazzz