如何使滑片宽度与孩子相同？

Question

我正在尝试使用具有以下布局的slidesPerView: 'auto'选项的swiperjs实现幻灯片显示：

    <div class="swiper-container">
        <div class="swiper-wrapper">
                <div class="swiper-slide py-3">
                    <div class="swiper-zoom-container">
                        <img src="...">
                    </div>
                </div>
        </div>
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
        <div class="swiper-pagination-wrapper">
            <div class="swiper-pagination"></div>
        </div>
    </div>

问题在于，无论图像的宽度有多小，幻灯片总是100％宽，例如我需要在这里使橙色容器与它们的灰色子容器一样宽：

https://codepen.io/anon/pen/JVpBZO

我不能简单地对宽度进行硬编码，因为我事先不知道。

我尝试在display: inline-flex上设置.swiper-slide，但它没有任何改变。