html - 如何强制 Bootstrap 切换菜单在另一个 div 上打开？

Question

如何强制 Bootstrap 切换菜单在 div 上打开，如下所示？
当我单击地球图标时，菜单会在地球旁边打开。
在这一点上，href 链接的宽度似乎设置不正确，因为
当我移过一个链接时，整个链接的一小部分在背景中变成灰色。

这是我的 Boot Demo

我正在寻找两种解决方案。
第一名:

2号:

Answer 1

在 Bootstrap 代码的丛林中花费数小时后，我发现了
我只需添加以下 css 片段即可获得我想要的第二个解决方案。
我仍然想知道如何在横幅上显示切换菜单
就像我为我的第一个想要的解决方案设想的那样......

这是第二个解决方案:

#menu .open .dropdown-menu {
    position: absolute;
    float: none;
    width: auto;
    margin-top: 55px;
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
}
#menu .open .dropdown-menu > li > a,
#menu .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 15px;
}
#menu .open .dropdown-menu > li > a {
    line-height: 20px;
}

你也可以在bootply上查看结果here