Элементы подменю раскрывающегося меню с карусели в бутстрапе не отображаются

Question

У меня есть требование показать выпадающие меню в буровом карусе. Все работает, кроме элементов подменю (скрывается за содержимым).

JSFiddle:

https://jsfiddle.net/Saneesh/pwmyvsw6/65/

Как я могу решить эту проблему?

EDIT

решение https://jsfiddle.net/pwmyvsw6/67/ работает, но горизонтальная полоса прокрутки появляется, когда мы click on the previous and next button, как на скриншоте ниже. как мы можем скрыть полосу прокрутки в этом решении?

THE IDEA I GOT IS вместо вкладок используйте меню. можно будет увидеть вкладки с прокруткой и содержимое вкладки в виде пунктов меню.

Answer 1

После проверки вашей скрипки кажется, что класс карусели имеет некоторые стили, которые останавливают выпадающий список. Добавление ниже в таблицу стилей отобразит их.

#myCarousel .carousel-inner { 
    overflow:visible; 
} 

В настоящее время установлено в overflow:hidden;, который вызывает ниспадающее меню, чтобы не отображать.

Я использовал идентификатор карусели для таргетинга на класс, чтобы он не вызывал проблем в будущем; на всякий случай, если вы добавите еще одну карусель, и она ведет себя по-другому. Как я думаю, overflow:hidden; может быть стилем по умолчанию, но его можно легко переубедить.

Вот ссылка на обновленной скрипку: https://jsfiddle.net/pwmyvsw6/66/