Slick Slider некоректно работает с циклом foreach smarty?

Question

[qwerty1777]

Ситуация такая. Есть родитель на котором висит slick slider. У этого родителя есть дочерний элемент который обрабатывается в foreach smarty и генерит нное кол-во продуктов. Slick Slider неккоректно отображает поведения слайдов. Может ли быть причина в том что дочерние элементы обрабатываются в foreach?

<div class="product_other__slide">
          {foreach from=$products item=product name=products}
            {if $smarty.foreach.products.index le 12}
            <div class="col-md-3 col-lg-3">
              <div class="product_trending__box">
                <div class="product_trending__item d-flex justify-content-center align-items-center">
                  <div class="product_trending__box-glass">
                    <img class="product_trending__item-glass" src="{$AltSkinDir}/images/content/glass1.png" alt="">
                  </div>
                  <div class="product_trending__sale">
                    <img src="{$AltSkinDir}/images/content/group-7.png" alt="">
                    <img src="{$AltSkinDir}/images/content/group-12.png" alt="">
                  </div>
                  <div class="product_trending__cart">
                    <span>add to cart</span>
                  </div>
                </div>
                <div class="product_trending__details">
                  <div class="product_trending__wrapper">
                  {*$product|@debug_print_var*}
                    <p class="product_trending__details-name">{$product.product}</p>
                    <i class="fa fa-heart-o product_trending__heart"></i>
                  </div>
                  <span class="product_trending__details-price">{$product.list_price}</span>
                </div>
              </div>
            </div>
            {/if}
            {/foreach}
         </div>

<script>
  $(document).ready(function() {
    $('.product_other__slide').slick({
      infinite: true,
      slidesToShow: 4,
      slidesToScroll: 4,
      dots: true
    });
  })
</script>

Comments

[sim3x]

Добавьте код в вопрос в тег code

[qwerty1777]

sim3x, добавил. css добавить?

[sim3x]

qwerty1777, лучше добавьте однозначное пояснение, что происходит не так

[qwerty1777]

sim3x, уже нашёл проблему. Юзаю bootstrap 4 и соответственно col в бутстрапе является flex элементом, видимо css свойства слайдера конфликтует с с flexbox