父元素之外的位置元素

Question

我正在使用引导程序构建可折叠的侧边栏，并且当侧边栏切换到迷你导航时，我试图让子菜单从侧边栏弹出。

示例：http://niftyfifty.nl/sidebar/

当窗口大小> 767，然后单击切换按钮，侧边栏缩小为迷你导航。当您将鼠标悬停在齿轮图标（设置）上时，子菜单将显示在图标右侧的侧栏中（您可以通过在悬停图标时向右滚动来查看）。我希望这个子菜单显示在侧边栏之外。任何人都可以帮我这个吗？

Answer 1

我不是100％确定这是你想要的，但你可以通过以下步骤将设置子菜单放在侧边栏之外。

首先你需要设置

overflow:visible;

用于侧边栏包装，以便仍可以看到div外部的项目。您需要重新定位子菜单，以便它弹出您想要的位置。 首先确保＆lt; li>设置元素是

position:relative;

你可以为所有人做这件事＆lt; li>元素如果所有子菜单都会以这种方式运行。然后设置＆lt; ul class =“collapse in”＆gt;

position:absolute;
top:0px;
right:-97px;          (the width of the sub-menu)

这将设置子菜单div的开始位置在设置按钮的右上角。现在，当您突出显示设置时，菜单会显示在其旁边而不是在其下方