Html 为什么赢了'；这个引导4导航栏不能创建等宽菜单项吗？

我有一个引导4导航栏，有六个导航项和一个内联搜索

菜单项被挤压在菜单的左侧（水平），有很大的空白，最右侧是搜索框

我正在努力使用的源代码（HTML/CSS）。（完整代码见下文）

不幸的是，尽管有

有没有办法解决这个问题

.page{
盒影：0.25px rgba（0,0,0,0.2）；
保证金：自动；
最大宽度：1280px；
}
.lqd标题菜单{
保证金：0；
背景色：#14a7e0；
}
.lqd标题菜单ul li{
左边框：1px实心#fff；
框大小：边框框；
颜色：#fff；
}
/*单个菜单项*/
.lqd标题菜单li a{
颜色：#fff；
/*将菜单项链接设置为白色*/
显示：块；
字号：1rem；
字体系列：“Avenir Next Cyr W00 Bold”，无衬线；
文本转换：大写；
}
/*在此处新建之前删除分隔符*/
.lqd标题菜单ul li：第一个孩子{
边界：中等无；
}
.lqd标题菜单ul li：最后一个子菜单{
右边框：1px实心#fff；
}

我使用了css flexbox（）

.collapse.navbar-collapse{
显示器：flex；
证明内容：之间的空间；
对齐项目：居中；
}
.collapse.navbar-collapse a{
颜色：白色；
}
.第页{
盒影：0.25px rgba（0,0,0,0.2）；
保证金：自动；
最大宽度：1280px；
}
.lqd标题菜单{
保证金：0；
背景色：#14a7e0；
}
.lqd标题菜单ul li{
左边框：1px实心#fff；
框大小：边框框；
颜色：#fff；
}
/*单个菜单项*/
.lqd标题菜单li a{
颜色：#fff；
/*将菜单项链接设置为白色*/
显示：块；
字号：1rem；
字体系列：“Avenir Next Cyr W00 Bold”，无衬线；
文本转换：大写；
}
/*在此处新建之前删除分隔符*/
.lqd标题菜单ul li：第一个孩子{
边界：中等无；
}
/*在给定后添加分隔符*/
.lqd标题菜单ul li：最后一个子菜单{
右边框：1px实心#fff；
}

谢谢！这很有帮助！如果可能的话，我想了解如何在BS4中实现这一点，在BS4中实现这一点似乎很简单@DaveMackey这里有一种方法可以用bootstrap的网格系统来代替：谢谢！这在较大的屏幕上看起来不错，但随着屏幕尺寸缩小（如手机、一些小型平板电脑）和菜单从屏幕右侧消失，它不会调整自身大小以适应屏幕宽度。是的，它不适合移动。您必须使用导航栏折叠功能，或者使用引导创建响应行。