没有显示带有引导程序中的carousal的下拉菜单的子菜单项

I have a requirement to show drop-down menus in a bootstrap carousal. Everything is working except the sub-menu items(hide behind the content).

我要求在bootstrap carousal中显示下拉菜单。除了子菜单项（隐藏在内容后面）之外，一切正常。

JSFiddle:

的jsfiddle：

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

How can I fix this issue?

我该如何解决这个问题？

EDIT

编辑

the solution https://jsfiddle.net/pwmyvsw6/67/ works, but the horizontal scrollbar is appearing when we click on the previous and next button like in the screenshot below. how can we hide the scrollbar in this solution?

解决方案https://jsfiddle.net/pwmyvsw6/67/工作，但是当我们点击上一个和下一个按钮时，水平滚动条就会出现，如下面的屏幕截图所示。我们如何隐藏此解决方案中的滚动条？

THE IDEA I GOT IS instead of menu use tabs. it will be possible to achieve the scroll-able tabs and tab content show as menu items.

IDEA I GOT IS而不是菜单使用选项卡。可以实现可滚动选项卡和选项卡内容显示为菜单项。

1 个解决方案

#1

After checking your fiddle it would seem that the carousel class has some styles that are stopping your dropdown from displaying. Adding the below to your stylesheet will display them.

检查你的小提琴后，似乎轮播类有一些样式阻止你的下拉显示。将以下内容添加到样式表将显示它们。

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

It is currently set to overflow:hidden; which is causing the dropdown not to display.

它目前设置为溢出：隐藏;这导致下拉列表不显示。

I have used the ID of the carousel to target the class so that it doesn't cause problems in the future; just in case you add another carousel and it behaves differently. As I think overflow:hidden; might be a default style, but it can be easily over-ridden.

我已经使用轮播的ID来定位课程，以便将来不会出现问题;以防你添加另一个旋转木马，它的行为不同。我认为溢出：隐藏;可能是默认样式，但它可以很容易地被覆盖。

Here is a link to the updated fiddle: https://jsfiddle.net/pwmyvsw6/66/

这是更新的小提琴的链接：https：//jsfiddle.net/pwmyvsw6/66/

#1