Как бороться с схлопыванием, при выведение в одно и то же место, разных элементов?

Question

[emptinessandform]

при нажатии на табы в одно и тоже место выводится разный контент. В данном случае это слайдеры. Слайдерам же я присвоил значение display: none, а активному display: block, но слайдеры ломаются
слайдер приходит в чувство и пресобирается при нажатии по нему, я даже сделал событие клик на нем, но это было не красиво.

Дальше я решил применить абсолютное позиционирование, но элемент выпал из потока и контейнер с background'ом схлопнулся.

я решил это одной строкой кода

$('.dishes').height($('.dishes__slider').outerHeight() + $('.dishes').outerHeight());

но при изменении размеров окна или повороте планшета, пропорции меняются, а все на процентах и снова все ломается. Можно конечное дописать в JS, что бы следил за ресайзом.
Но может вы знаете решение по лучше?
Поделитесь пожалуйста)

Comments

[Александр Зонов]

где-то бы посмотреть разметку и код в действии, чтобы понять что именно происходит, дайте ссылочку

Answer 1

[name surname]

при клике на таб можно слайдер переинициализировать

Comments

[emptinessandform]

да, но он дергается и это заметно.