Какой-то баг с slick slide?

Question

[Aleks Kirilov]

Какой-то баг с slick-slide
вот код с html:

<div class="row mr-auto ml-auto slide-items">
            <div class="col-lg-4">
              <div class="footer-wrapper">
                <div class="footer-item">
                  <div class="footer-top-up">
                    <div class="footer-top-icon">
                      <img src="img/oval-1.png" alt="" />
                    </div>
                    <div class="footer-top-text">
                      <p class="footer-top-text__special">Arakat Bank</p>
                      <p>International Bank Ltd.</p>
                    </div>
                  </div>
                  <div class="footer-middle">
                    <p class="footer-middle__icon-special">“</p>
                  </div>
                  <div class="footer-bottom">
                    <p class="footer-bottom__text">
                      Fusce vehicula dolor arcu, sit amet blandit dolor mollis
                      nec. Donec viverra eleifend lacus, vitae ullamcorper
                      metus. Sed sollicitudin ipsum.
                    </p>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-lg-4">
              <div class="footer-wrapper">
                <div class="footer-item">
                  <div class="footer-top-up">
                    <div class="footer-top-icon">
                      <img src="img/oval-2.png" alt="" />
                    </div>
                    <div class="footer-top-text">
                      <p class="footer-top-text__special">
                        Chrsitopher Company Ltd.
                      </p>
                      <p>Design & Development</p>
                    </div>
                  </div>
                  <div class="footer-middle">
                    <p class="footer-middle__icon-special">“</p>
                  </div>
                  <div class="footer-bottom">
                    <p class="footer-bottom__text">
                      Fusce vehicula dolor arcu, sit amet blandit dolor mollis
                      nec. Donec viverra eleifend lacus, vitae ullamcorper
                      metus. Sed sollicitudin ipsum.
                    </p>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-lg-4">
              <div class="footer-wrapper">
                <div class="footer-item">
                  <div class="footer-top-up">
                    <div class="footer-top-icon">
                      <img src="img/oval-3.png" alt="" />
                    </div>
                    <div class="footer-top-text">
                      <p class="footer-top-text__special">
                        Jigsawlab Studio Inc.
                      </p>
                      <p>Interactive Prototyping</p>
                    </div>
                  </div>
                  <div class="footer-middle">
                    <p class="footer-middle__icon-special">“</p>
                  </div>
                  <div class="footer-bottom">
                    <p class="footer-bottom__text">
                      Fusce vehicula dolor arcu, sit amet blandit dolor mollis
                      nec. Donec viverra eleifend lacus, vitae ullamcorper
                      metus. Sed sollicitudin ipsum.
                    </p>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-lg-4">
              <div class="footer-wrapper">
                <div class="footer-item">
                  <div class="footer-top-up">
                    <div class="footer-top-icon">
                      <img src="img/oval-1.png" alt="" />
                    </div>
                    <div class="footer-top-text">
                      <p class="footer-top-text__special">Arakat Bank</p>
                      <p>International Bank Ltd.</p>
                    </div>
                  </div>
                  <div class="footer-middle">
                    <p class="footer-middle__icon-special">“</p>
                  </div>
                  <div class="footer-bottom">
                    <p class="footer-bottom__text">
                      Fusce vehicula dolor arcu, sit amet blandit dolor mollis
                      nec. Donec viverra eleifend lacus, vitae ullamcorper
                      metus. Sed sollicitudin ipsum.
                    </p>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-lg-4">
              <div class="footer-wrapper">
                <div class="footer-item">
                  <div class="footer-top-up">
                    <div class="footer-top-icon">
                      <img src="img/oval-2.png" alt="" />
                    </div>
                    <div class="footer-top-text">
                      <p class="footer-top-text__special">
                        Chrsitopher Company Ltd.
                      </p>
                      <p>Design & Development</p>
                    </div>
                  </div>
                  <div class="footer-middle">
                    <p class="footer-middle__icon-special">“</p>
                  </div>
                  <div class="footer-bottom">
                    <p class="footer-bottom__text">
                      Fusce vehicula dolor arcu, sit amet blandit dolor mollis
                      nec. Donec viverra eleifend lacus, vitae ullamcorper
                      metus. Sed sollicitudin ipsum.
                    </p>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-lg-4">
              <div class="footer-wrapper">
                <div class="footer-item">
                  <div class="footer-top-up">
                    <div class="footer-top-icon">
                      <img src="img/oval-3.png" alt="" />
                    </div>
                    <div class="footer-top-text">
                      <p class="footer-top-text__special">
                        Jigsawlab Studio Inc.
                      </p>
                      <p>Interactive Prototyping</p>
                    </div>
                  </div>
                  <div class="footer-middle">
                    <p class="footer-middle__icon-special">“</p>
                  </div>
                  <div class="footer-bottom">
                    <p class="footer-bottom__text">
                      Fusce vehicula dolor arcu, sit amet blandit dolor mollis
                      nec. Donec viverra eleifend lacus, vitae ullamcorper
                      metus. Sed sollicitudin ipsum.
                    </p>
                  </div>
                </div>
              </div>
            </div>
          </div>

JavaScript код:

$(document).ready(function() {
  $(".slide-items").slick({
    infinite: true,
    slidesToShow: 3,
    slidesToScroll: 3
  });
});

И вот ошибка

Comments

[nvdfxx]

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

[Ankhena]

1. Сократите количество оберток.
Декоративная кавычка это один (!) псевдоэлемент, а не 2 DOM элемента.
div вокруг одного p лишний. div вокруг двух p тоже вероятно лишний, но не видно макета.
и т.д.
Уже станет легче.
2. Классы col-lg-4 лишние, потому что слик все равно переопределит их за счет slidesToShow: 3
3. Чтобы можно было вам помочь, нужно выложить рабочий код с проблемой в песочницу типа jsfiddle.net
Потому что стили вы даже не выложили, но если бы и выложили сюда, то вычислять их глазками вряд ли кто станет.