Здравствуйте!
Подскажите, пожалуйста, как сделать чтобы при раскрытии аккордеона, появлялась полоса прокрутки на общей панели (первый div), сейчас контент аккордеона раскрывается не полностью, а полосы прокрутки нет?
<div class="overflow-y-auto block overflow-x-hidden bg-white h-mobileMain md:h-main w-full py-4 px-1 pr-2 flex flex-col items-center">
<div class="flex justify-between items-center w-full max-w-2xl mt-3 pb-3">
<p class="flex-grow">
Название</p>
<svg
class="hover:text-blue-500 text-dark-gray w-5 h-5 sm:w-7 sm:h-7 sm:mr-1" fill="none"
stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</div>
<div
class="border-b max-w-2xl flex justify-between items-stretch overflow-hidden transition-all duration-1000 ease-in-out"
:class="{'max-h-full':isActive,'max-h-0':!isActive }">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam assumenda dicta error molestiae quia. A
atque enim et harum rerum! A facere facilis harum illo magni modi nemo nobis veniam.
</div>
<div class="flex justify-between items-center w-full max-w-2xl mt-3 pb-3">
<p class="flex-grow">
Название</p>
<svg
class="hover:text-blue-500 text-dark-gray w-5 h-5 sm:w-7 sm:h-7 sm:mr-1" fill="none"
stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</div>
<div
class="border-b max-w-2xl flex justify-between items-stretch overflow-hidden transition-all duration-1000 ease-in-out"
:class="{'max-h-full':isActive,'max-h-0':!isActive }">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam assumenda dicta error molestiae quia. A
atque enim et harum rerum! A facere facilis harum illo magni modi nemo nobis veniam.
</div>
<div class="flex justify-between items-center w-full max-w-2xl mt-3 pb-3">
<p class="flex-grow">
Название</p>
<svg
class="hover:text-blue-500 text-dark-gray w-5 h-5 sm:w-7 sm:h-7 sm:mr-1" fill="none"
stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</div>
<div
class="border-b max-w-2xl flex justify-between items-stretch overflow-hidden transition-all duration-1000 ease-in-out"
:class="{'max-h-full':isActive,'max-h-0':!isActive }">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam assumenda dicta error molestiae quia. A
atque enim et harum rerum! A facere facilis harum illo magni modi nemo nobis veniam.
</div>
<div class="flex justify-between items-center w-full max-w-2xl mt-3 pb-3">
<p class="flex-grow">
Название</p>
<svg
class="hover:text-blue-500 text-dark-gray w-5 h-5 sm:w-7 sm:h-7 sm:mr-1" fill="none"
stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</div>
<div
class="border-b max-w-2xl flex justify-between items-stretch overflow-hidden transition-all duration-1000 ease-in-out"
:class="{'max-h-full':isActive,'max-h-0':!isActive }">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam assumenda dicta error molestiae quia. A
atque enim et harum rerum! A facere facilis harum illo magni modi nemo nobis veniam.
</div>
<div class="flex justify-between items-center w-full max-w-2xl mt-3 pb-3">
<p class="flex-grow">
Название</p>
<svg
class="hover:text-blue-500 text-dark-gray w-5 h-5 sm:w-7 sm:h-7 sm:mr-1" fill="none"
stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</div>
<div
class="border-b max-w-2xl flex justify-between items-stretch overflow-hidden transition-all duration-1000 ease-in-out"
:class="{'max-h-full':isActive,'max-h-0':!isActive }">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam assumenda dicta error molestiae quia. A
atque enim et harum rerum! A facere facilis harum illo magni modi nemo nobis veniam.
</div>
<div class="flex justify-between items-center w-full max-w-2xl mt-3 pb-3">
<p class="flex-grow">
Название</p>
<svg
class="hover:text-blue-500 text-dark-gray w-5 h-5 sm:w-7 sm:h-7 sm:mr-1" fill="none"
stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</div>
<div
class="border-b max-w-2xl flex justify-between items-stretch overflow-hidden transition-all duration-1000 ease-in-out"
:class="{'max-h-full':isActive,'max-h-0':!isActive }">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam assumenda dicta error molestiae quia. A
atque enim et harum rerum! A facere facilis harum illo magni modi nemo nobis veniam.
</div>
<div class="flex justify-between items-center w-full max-w-2xl mt-3 pb-3">
<p class="flex-grow">
Название</p>
<svg
class="hover:text-blue-500 text-dark-gray w-5 h-5 sm:w-7 sm:h-7 sm:mr-1" fill="none"
stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
</svg>
</div>
<div
class="border-b max-w-2xl flex justify-between items-stretch overflow-hidden transition-all duration-1000 ease-in-out"
:class="{'max-h-full':isActive,'max-h-0':!isActive }">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam assumenda dicta error molestiae quia. A
atque enim et harum rerum! A facere facilis harum illo magni modi nemo nobis veniam.
</div>
</div>
Простой
Средний