使旋转木马缩略图在移动设备中具有响应性

http://i.imgur.com/8tvXamd.png

这是包含缩略图的ul:

<ul class="hide-bullets">

    <li class="col-sm-3 hidden-phone">
       <a class="thumbnail" id="carousel-selector-0"><img src="images/sommerhuse/blokhus/BL-Kokk01.jpg"></a>
    </li>

    <li class="col-sm-3">
       <a class="thumbnail" id="carousel-selector-1"><img src="images/sommerhuse/blokhus/BL-Kokk02.jpg"></a>
    </li>

    <li class="col-sm-3">
       <a class="thumbnail" id="carousel-selector-2"><img src="images/sommerhuse/blokhus/BL-Stue01.jpg"></a>
    </li>

    <li class="col-sm-3">
       <a class="thumbnail" id="carousel-selector-3"><img src="images/sommerhuse/blokhus/Blokhus ude.jpg"></a>
    </li>
</ul>

.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {
    display: block;
    max-width: 100%;
    /*height: auto;*/
}

.thumbnail {
    padding: 0;
}