我很感激,如果有人可以建议如何修改Twitter Bootstrap 2轮播,以便一次显示一组缩略图,类似于这个jquery插件(jcarousel)
http://sorgalla.com/projects/jcarousel/examples/static_simple.html
谢谢
我正在尝试使用多个项目设置Twitter Bootstrap轮播,同时保持响应能力.
我有一个用于测试设置的jsfiddle http://jsfiddle.net/Va8Un/
我想要发生的是显示4个图像,每个图像都带有标题以在旋转木马窗格中保存项目标题等,并且应调整它们以适应屏幕以始终保持在同一行.现在它完全无视我做出调整图像尺寸与屏幕的任何企图,我想通设置IMG max-width:100%;会做的伎俩,但它似乎并不影响它.此外,第四个图像被推到第二行,因为图像没有调整大小:

有什么方法可以用纯CSS来解决这个问题,还是应该寻找Twitter Bootstrap以外的选项?
你可以在这里查看结果:http://jsfiddle.net/Va8Un/embedded/result/
这是HTML:
<div class="container">
<div class="carousel slide" id="myCarousel">
<div class="carousel-inner">
<div class="item active">
<ul class="thumbnails span12">
<li>
<div class="caption">
<h5>Caption</h5>
</div>
<div class="thumbnail">
<img src="http://placehold.it/260x180" alt="">
</div>
</li>
<li>
<div class="caption">
<h5>Caption</h5>
</div>
<div class="thumbnail">
<img src="http://placehold.it/260x180" alt="">
</div>
</li>
<li>
<div class="caption">
<h5>Caption</h5>
</div>
<div class="thumbnail">
<img src="http://placehold.it/260x180" alt="">
</div>
</li>
<li>
<div class="caption">
<h5>Caption</h5>
</div>
<div class="thumbnail">
<img src="http://placehold.it/260x180" alt="">
</div>
</li>
</ul>
</div>
<div class="item"> …Run Code Online (Sandbox Code Playgroud)