Html 如何在手机上正确对齐这些箭头

我在调整转盘项目时遇到问题。。它们在移动设备上显示不好

<div class="row">
        <div class="col-12">
            <div class=" owl-carousel custom-arrow" id="trending-slider">
                @foreach($trending as $product)
                        <div class="item">
                            <div class="trending-product">  
                            <div class="add-wish">
                                <form class="addtowishlist-form">
                                    {{csrf_field()}}
                                    @if(Session::has('uniqueid'))
                                        <input type="hidden" name="uniqueid" value="{{Session::get('uniqueid')}}">
                                    @else
                                        <input type="hidden" name="uniqueid" value="{{str_random(7)}}">
                                    @endif
                                    
                                    <input type="hidden" name="title" value="{{$product->title}}">
                                    <input type="hidden" name="product_id" value="{{$product->id}}">
                                    <input type="hidden" name="user_id" value="">
                                    <input type="hidden" id="cost" name="cost" value="{{$product->price}}">
                                   
                                    <i class="fa fa-heart-o product-addWishlist-btn to-wishlist"  id="{{$product->id}}" aria-hidden="true" att="0"></i>
                    
                                </form>
                                
                            </div>
                               <a href="{{url('/product')}}/{{$product->id}}/{{$product->title}}">  <img class="img-responsive" src="{{url('/timthumb.php?src=/assets/images/products')}}/{{$product->feature_image}}&amp;w=700&amp;h=443" alt="Product Image">
                                <h5>{{$product->title}}</h5></a>
                                <p> {{ substr(str_replace('&nbsp;', ' ', strip_tags($product->description)), 0, 600)}}</p>
                                <ul class="price-list">
                                    <li><i class="fa fa-dollar"></i>{{$product->price}}</li>
                                    @if($product->rocketdelivery == 'yes')
                                    <li>
                                        <img class="rocket-delivery" src="{{ URL::asset('kumba/images/rocket-delivery.png')}}">
                                    </li>
                                    @else
                                    <li></li>
                                    @endif
                                </ul>
                                @if($product->bylocal == 'yes')
                                    <img class="buy-local" src="{{ URL::asset('kumba/images/buy-local.png')}}">
                                @endif
                                <div class="ratings">
                                    <div class="empty-stars"></div>
                                    <div class="full-stars" style="width:{{\App\Review::ratings($product->id)}}%">
                              

@foreach（$产品趋势）
{{csrf_field（）}}
@if（会话：：has（'uniqueid'））
@否则
@恩迪夫
{{substr（str_replace（''，''，strip_标签（$product->description）），0600）}


{{$product->price}
@如果（$product->rocketdelivery=='yes'）


@否则

@恩迪夫

@如果（$product->bylocal=='yes'）
@恩迪夫

这是我将产品显示为旋转木马的代码。那么箭头现在有问题了