Некорректное отображение изображений в owl carousel

Question

Я инициализировал и настроил owl carousel, с этим проблем не возникло. Суть в том что иконки и некоторый текст добавляются в карточки через скрипт. В карусели три карточки и в каждой карточке иконки отображаются по разному. В первой карточке иконка есть, все хорошо. Во второй карточке иконка не появляется совсем. В третьей карточке иконка появляется, если прокрутить слайдер до первого элемента, а потом покрутить обратно на третий элемент. Вот такая проблема, кто знает как пофиксить?

$('.owl-carousel').owlCarousel({
  center: false,
  items: 1,
  loop: true,
  margin: 0,
  responsive: {
    320: {
      items: 1
    },
    1920: {
      items: 2
    },
    2000: {
      items: 4
    }
  },
  nav: false,
  dots: false
});

<div class="meteo-today__cards">
  <div class="owl-carousel" id='sld-1'>
    <div class="meteo-today__card">
      <div class='meteo-today__card-icon'>
        <img src="">
      </div>
      <div class='meteo-today__card-temperature'></div>
      <div class='meteo-today__card-time-of-day'>Утро</div>
    </div>

    <div class="meteo-today__card">
      <div class='meteo-today__card-icon'>
        <img src="">
      </div>
      <div class='meteo-today__card-temperature'></div>
      <div class='meteo-today__card-time-of-day'>День</div>
    </div>

    <div class="meteo-today__card">
      <div class='meteo-today__card-icon'>
        <img src="">
      </div>
      <div class='meteo-today__card-temperature'></div>
      <div class='meteo-today__card-time-of-day'>Вечер</div>
    </div>
  </div>
</div>

БЛОГ НА HUSL

Некорректное отображение изображений в owl carousel

Ответы (0 шт):