用于响应式 2 元素滑块的 HTML/CSS(/JS?)

Question

我希望创建一个水平滚动滑块，其中两个元素在任何给定时间都在视口中可见。视口是一个容器 div，其宽度由媒体查询控制，因此它是完全响应的。如果视口变得足够小（移动），我希望将 2 个可见元素堆叠起来。这是我要完成的工作的视觉效果：http://i.imgur.com/SQJ9Hv0.png

我遇到的最大问题是因为我想一次显示 2 个元素。容器 div 是响应式的，但它里面的 ul 更宽。所以我不能将元素的宽度设置为 50%，因为它将是整个 ul 的 50%。

我可以只用 CSS 来完成这个样式，还是我也必须使用一些 javascript 来管理这些东西的宽度？任何帮助是极大的赞赏！

Answer 1

试试 Twitter Bootstrap，它有一个特定的响应式 CSS 布局，可以为你做这种事情。我不使用它创建整个站点，但它的功能非常好，请查看： http://twitter.github.io/bootstrap/

Answer 2

不，请不要使用 JavaScript 来处理。您可以使用Twitter Bootstrap's fluidGridSystem 来支持响应式样式。您还可以在http://jsfiddle.net/ 分享代码，以便人们更轻松地为您提供帮助。