Прыгает footer при анимации карусели над ним. Подскажите как исправить пожалуйста!

Question

Есть вот такая карусель. Центральный элемент карусели увеличивается свойством width:130%. В этот же момент footer, который сразу под этой каруселью тоже прыгает вверх, потом вниз во время анимации. Как сделать, чтобы footer был статичным?

<div id="target" class="carousel-2 owl-carousel">

  <div class="owl-pic">
    <img src="https://via.placeholder.com/150" alt="photo">
  </div>

  <div class="owl-pic">
    <img src="https://via.placeholder.com/150" alt="photo">
  </div>

  <div class="owl-pic">
    <img src="https://via.placeholder.com/150" alt="photo">
  </div>
</div>


<footer class="social-footer portfolio">
  <div class="icons">
    <div class="social-footer-icons">
      <a href="https://www.vk.com/">
        <img src="https://img.icons8.com/clouds/100/000000/vk-com.png"/>
      </a>
      <a href="https://www.instagram.com/">
        <img src="https://img.icons8.com/clouds/100/000000/instagram-new--v3.png" />
      </a>
      <a href="https://www.t.me/">
        <img src="https://img.icons8.com/clouds/100/000000/telegram-app.png"/>
      </a>
    </div>
  </div>
</footer>

Answer 1

Дай футеру свойство margin-top: auto;

Answer 2

попробуйте следующее

  <style>
    footer
    {
      margin-top: auto
    }
  </style>

БЛОГ НА HUSL

Прыгает footer при анимации карусели над ним. Подскажите как исправить пожалуйста!

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