Twitter bootstrap 引导缩略图滑块，上次缩略图后的空白

我有一个引导缩略图滑块，我显示每行6个图像的图像。但我总共有7幅图像，第一行显示6幅图像，但最后一幅图像显示空白。如何删除该空间？请帮忙，下面是代码

 <div class="card">
            <div class="card-body">
                <h5 class="card-title" style="margin:10px "><strong>Menu</strong></h5>
                <div id="multi-item-example" class="carousel slide carousel-multi-item" data-ride="carousel">
                    <div class="carousel-inner" role="listbox">
                        @if(is_null($brands['menuItem']))
                            <p class="text-danger" style="margin-left: 20px">no menu items.</p>
                        @else
                        @foreach(($brands['menuItem'])->chunk(6) as $menuItem)
                            <div class="carousel-item {{ $loop->first ? ' active' : '' }}">
                                @foreach($menuItem as $item)
                                    <div class="col-6 col-sm-4 col-md-2 col-lg-2 float-left">


                                            <a href="#">
                                                <img src="/storage/{{$item->image}}" alt="Image"
                                                        class="img-fluid">
                                            </a>
                                            <br>
                                            <h6 style="text-align: center;">RM{{$item->price}}</h6>

                                    </div>
                                @endforeach
                            </div>
                        @endforeach
                        @endif

                    </div>
                    <a class="carousel-control-prev"  data-target="#multi-item-example" role="button"
                       data-slide="prev" style="background-color: lightgray; width: 3%; opacity: 1; height: 87%;">
                        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="carousel-control-next" style="background-color: lightgray; width: 3%; opacity: 1;
                    height: 87%;" data-target="#multi-item-example" role="button"
                       data-slide="next">
                        <span class="carousel-control-next-icon" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>


                </div>
            </div>
        </div>

菜单
@如果（为空（$brands['menuItem']））
没有菜单项

@否则
@foreach（$brands['menuItem]->chunk（6）作为$menuItem）
@foreach（$menuItem作为$item）


RM{{$item->price}
@endforeach
@endforeach
@恩迪夫
我将保留空白，并将所有图像与容器中心对齐；因此，如果只显示一个，它将显示在容器的中心。我首先使用浏览器开发工具（F12），确保呈现的html符合旋转木马的BS规范，并确保所有标记配对，并且没有生成太多的项目。