Абсолютно позиционированный элемент не остается в относительном родительском элементе

Question

Я создаю многоступенчатую форму, а затем анимирую шаги. Я сгруппировал разные вопросы в отдельные fieldsets, а затем оживил эти fieldsteps. К родительской оболочке применено position:relative.

Когда вы нажимаете «предыдущий», вы можете видеть, что нижний колонтитул отстает от fieldset, который теперь имеет position:absolute. Как мне это остановить? Я не могу указать явно заданную высоту для родительского элемента, так как она будет меняться от одного шага к другому.

https://codepen.io/JustHam/pen/yLejWVZ

введите описание изображения здесь

Answer 1

Я заметил, что внутри вашего прослушивателя кликов для кнопки «Далее» вы устанавливаете абсолютную позицию current_fs, но в прослушивателе кликов предыдущей кнопки вы не меняете положение обратно на относительное.

Я изменил вашу функцию complete внутри прослушивателя нажатия кнопки «Назад», изменив положение previous_fs обратно на относительное, и, похоже, он работает:

      complete: function () {
        current_fs.hide();
        animating = false;
        previous_fs.css({position: 'relative'})
      },