Верстка Bootstrap. Blade

Имеется представление. И пользуется bootstrap. Проблема заключается в том, что первый элемент при переборе отображается криво. В чем может быть причина?

Код представления

 <div class="row">  
                    <ul class="mx-auto">                                                 
                        @foreach(\App\Vendor::topVendors() as $vendor)                                                          
                                   <li class="d-block mx-auto col-4 text-center">
                                     <div class="text-center">
                                       <img style="width: 180px;
                                       height: 230px;
                                       border-radius: 15px;"
                                       src="{{ asset('storage'  . $vendor -> vendor -> avatarshop) }}"
                                       alt="{{$vendor->username}}">
                                      </div>
                                        <br />                                                                                                                                       
                                        <a href="{{route('vendor.show',$vendor)}}"
                                           style="text-decoration: none;
                                           color: #1a57ba;"><b>{{$vendor->user->username}}</b></a>
                                        <br />                                                               
                                        <span>
            @include('includes.purchases.stars', ['stars' => $vendor -> vendor -> avgRate($this)]) ({{$vendor->vendor->avgRate($this)}})
                                        </span>
                                        <br />                                   
                                        <span>Продаж: <span class="font-weight-semibold">{{$vendor->vendor->completedOrders()}}</span>
                                    </li>                                
                               </ul>
                        @endforeach
                    </div>