Css 最大宽度为100%的图像不在位置为绝对的元素内缩放

我目前正在开发一个响应性的carousel jquery插件。旋转木马在桌面设备上显示3幅图像，在平板电脑上显示2幅图像，在移动设备上显示1幅图像。LI项目向左浮动以创建内容条带，旋转木马容器具有overflow:hidden以隐藏条带中当前未显示的元素

在移动设备（最大宽度：767px）上，仅显示一个LI，我希望LI中的图像随着浏览器大小的减小而缩放。这是目前没有工作，我相信这可能是因为UL的立场：绝对。我已经尝试将图像移出旋转木马，然后它会按预期进行缩放，因此我假设应用于旋转木马的一些CSS会影响图像的CSS

任何帮助都会很好

转盘由以下HTML组成：

<div class="container carousel-container">
    <ul class="carousel row">
        <li class="col-md-4 col-sm-6 item">
            <a href="#"><img src="http://lorempixel.com/768/384/" class="img-responsive"></a>
        </li>
        <li class="col-md-4 col-sm-6 item">
            <a href="#"><img src="http://lorempixel.com/768/384/" class="img-responsive"></a>
        </li>
        <li class="col-md-4 col-sm-6 item">
            <a href="#"><img src="http://lorempixel.com/768/384/" class="img-responsive"></a>
        </li>
    </ul>
</div>

下面是一个示例，如果指定父对象的宽度

max-width: 100%;

---

工作正常，否则会失败。尝试拉伸输出iframe。

最大宽度：100%；将图像缩放到其父级宽度，但此处没有父级宽度的声明，因此图像应拉伸到的宽度是多少？只是尝试将767px的宽度添加到所有LIs中，结果没有任何差异。在删除display:block之后，可以再次测试；从照片上看？是的，我试过了，但还是不太正确。我可以向Github承诺让你去分叉吗？谢谢你的帮助。

max-width: 100%;