如果图像不大，如何在Bootstrap轮播滑块中拟合图像？

Question

我的头版有一个旋转木马滑块。我的问题是我的图像宽度不适合我的窗口。

以下是我的示例滑块的打印屏幕：

我已将图片设置为100％，但在滑动图片时会恢复原始大小，然后下一张图片将适合页面。

我有这个代码：

<div id="myCarousel" class="carousel slide" data-ride="carousel" style="float: none !important;">
                    <!-- Indicators -->
                    <ol class="carousel-indicators">
                        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                        <li data-target="#myCarousel" data-slide-to="1"></li>
                        <li data-target="#myCarousel" data-slide-to="2"></li>
                        <li data-target="#myCarousel" data-slide-to="3"></li>
                    </ol>
                    <div class="carousel-inner">
                        <div class="item active">
                            <a href="http://www.kamakurashirts.net/shop/pages/vintageivyshirts2014.aspx">
                                <img src="./images/banner0.png" title="This is banner 1" class="img-responsive slider_image_item" />
                            </a>
                        </div>

                        <div class="item">
                            <a href="http://www.kamakurashirts.net/shop/c/c102001">
                                <img src="./images/banner1.png" title="This is banner 2" class="img-responsive slider_image_item" />
                            </a>
                        </div>

                        <div class="item">
                            <a href="http://www.kamakurashirts.net/shop/e/eNEW/">
                                <img src="./images/banner2.png" title="This is banner 3" class="img-responsive slider_image_item" />
                            </a>
                        </div>

                        <div class="item">
                            <a href="http://www.kamakurashirts.net/shop/pages/find_your_size.aspx">
                                <img src="./images/banner3.png" title="This is banner 4" class="img-responsive slider_image_item" />
                            </a>
                        </div>
                    </div>

                    <a id="left-slide" class="left carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
                    <a id="right-slide" class="right carousel-control" href="#myCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>

            </div><!-- /.carousel -->

这个CSS：

.slider_image_item { 
    width: 100% !important; 
    max-width: 1400px !important;
} 

我需要做些什么才能在我的页面中将图像设置为100％。图像的原始大小在我包含的图片中。