Image box and img height issue fixed on laravel html css

<div class="col mb-3 p-1">

    <div class="single-product">

        <div class="pro-img-icon">

            <div class="product0deal-icon">

                <i class="fa fa-bolt" aria-hidden="true"></i>

            </div>

            <div class="wish-compare-icon">

     <a href="javascript:void(0)" class="hov-svg-white" onclick="addToWishList(3647)" data-toggle="tooltip" data-title="Add to wishlist" data-placement="left" data-original-title="" title="">

                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="14.4" viewBox="0 0 16 14.4">

                        <g id="_51a3dbe0e593ba390ac13cba118295e4" data-name="51a3dbe0e593ba390ac13cba118295e4" transform="translate(-3.05 -4.178)">

                            <path id="Path_32649" data-name="Path 32649" d="M11.3,5.507l-.247.246L10.8,5.506A4.538,4.538,0,1,0,4.38,11.919l.247.247,6.422,6.412,6.422-6.412.247-.247A4.538,4.538,0,1,0,11.3,5.507Z" transform="translate(0 0)" fill="#919199"></path>

                            <path id="Path_32650" data-name="Path 32650" d="M11.3,5.507l-.247.246L10.8,5.506A4.538,4.538,0,1,0,4.38,11.919l.247.247,6.422,6.412,6.422-6.412.247-.247A4.538,4.538,0,1,0,11.3,5.507Z" transform="translate(0 0)" fill="#919199"></path>

                        </g>

                    </svg>

                </a>

                <a href="javascript:void(0)" class="hov-svg-white" onclick="addToCompare(3647)" data-toggle="tooltip" data-title="Add to compare" data-placement="left" data-original-title="" title="">

                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">

                        <path id="_9f8e765afedd47ec9e49cea83c37dfea" data-name="9f8e765afedd47ec9e49cea83c37dfea" d="M18.037,5.547v.8a.8.8,0,0,1-.8.8H7.221a.4.4,0,0,0-.4.4V9.216a.642.642,0,0,1-1.1.454L2.456,6.4a.643.643,0,0,1,0-.909L5.723,2.227a.642.642,0,0,1,1.1.454V4.342a.4.4,0,0,0,.4.4H17.234a.8.8,0,0,1,.8.8Zm-3.685,4.86a.642.642,0,0,0-1.1.454v1.661a.4.4,0,0,1-.4.4H2.84a.8.8,0,0,0-.8.8v.8a.8.8,0,0,0,.8.8H12.854a.4.4,0,0,1,.4.4V17.4a.642.642,0,0,0,1.1.454l3.267-3.268a.643.643,0,0,0,0-.909Z" transform="translate(-2.037 -2.038)" fill="#919199"></path>

                    </svg>

                </a>

            </div>

            <div class="related-product-single-img">

                <a href="{{ route('product', $relatedProduct->slug) }}"

                    title="{{ $relatedProduct->getTranslation('name') }}">

                    <img class="lazyload mx-auto img-fit has-transition skeleton"

                    src="{{ static_asset('assets/img/placeholder.svg') }}"

                    data-src="{{ uploaded_asset($relatedProduct->thumbnail_img) }}"

                    alt="{{ $relatedProduct->getTranslation('name') }}"

                    title="{{ $relatedProduct->getTranslation('name') }}"

                    onerror="this.onerror=null;this.src='{{ static_asset('assets/img/placeholder.svg') }}';">

                </a>

            </div>

        </div>

        <div class="product-content">

            <h3 class="fw-400 fs-13 text-truncate-2 lh-1-4 mb-0 h-35px text-left">

                <a href="{{ route('product', $relatedProduct->slug) }}" class="d-block text-reset hov-text-primary"

                    title="{{ $relatedProduct->getTranslation('name') }}">

                    <span>{{ $relatedProduct->getTranslation('name') }}</span>

                </a>

            </h3>

            <p>{{ home_discounted_base_price($relatedProduct) }}

                @if (home_base_price($relatedProduct) != home_discounted_base_price($relatedProduct))

                    <small><del>{{ home_base_price($relatedProduct) }}</del></small>

                @endif

            </p>

            @if ($relatedProduct->rating > 0)

                <div class="review">

                    <ul>

                        @for ($i = 1; $i <= 5; $i++)

                            <li><i class="fa fa-star {{ $i <= $relatedProduct->rating ? 'filled' : 'empty' }}"

                                    aria-hidden="true"></i></li>

                        @endfor

                    </ul>

                    <p>({{ $relatedProduct->review_count }})</p> <!-- Assuming you have a review_count property -->

                </div>

            @endif

        </div>

    </div>

</div> 

image & img box height issue fix:

...........................................................

/* related product and best sale product box size fix start */

#best-sellers-container .single-product {

    height: auto;

}

.related-product-single-img {

    width: 100%;

    aspect-ratio: 3 / 4;

    overflow: hidden;

}

.related-product-single-img img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}

/* related product and best sale product box size fix end */