如何使这个部分可折叠的Navbar在Bootstrap 4上显示我想要的位置？

Question

我正在尝试使Bootstrap 4导航栏仅部分折叠。

基本上，我希望始终与右侧对齐的某些项始终保持可见，而如果您尝试在移动设备上打开网站，则左侧的大多数Navbar项将折叠到菜单中。

问题是，当您展开菜单时，折叠的元素会像您期望的那样显示在固定菜单的前面，但是出于明显的美学原因，我希望它们显示在固定菜单的下面。

工作示例：http://jsfiddle.net/sfm70xLe/

扩展后所需的结果：

访问折叠项时所需的结果：

我一直在尝试元素的配置以及尝试float-right和float-right，但是事实证明它是无效的，我不确定如何在不进行大幅度更改的情况下进行此操作。 Bootstrap为我奠定了基础。有什么想法吗？

Answer 1

如果在HTML中将navbar-header div向上移动到navbar-collapse div之前，它将起作用。然后，您只需要使用order即可将导航栏标题向右移动（大于中号）。