Html 如何使我的导航栏像flexbox一样响应，在小断点处变成两行？

我有一个好看的导航栏在我的页面底部，中间有一个标志，可以带你到主页，两边有两个链接可以带你到那些页面。我曾经使用@media css使页面变小，但是一旦你点击了xs/sm断点，它就太大了，无法显示在屏幕上

例：

|-------视频---------------关于---------------徽标/品牌---------------时间表----------询问--------|

<> P>是否有任何方法使NavBar链接在两边的堆叠上，这样我就可以保持中间的标志的干净、对称的外观，而不是使它成为一个折叠菜单按钮？

例：

|----视频----标志/品牌----时间表----|

---

|----关于------------------询问----------------

如果您使用的是bootstrap v4，也许您可以在第一列和第三列中放置另一行，然后在新行中放置两列（每个链接一列）。使用col-sm-12强制线条在小屏幕上缠绕，然后使用col-md-6让它们在变大时水平堆叠。不幸的是，它有很多嵌套的div。

您可以使用嵌套的flex容器，并用最少的代码实现所需的结果：

.container、.left、.right{
显示器：flex；
}
.左，.右{
柔性包装：包装；
}
.容器分区、.左分区、.右分区{
柔性生长：1；
文本对齐：居中；
填充：0px 8px 0px 8px；
}

视频
关于
标志/品牌
日程
问

是。这是可能的。发布您的代码，以便我们向您展示如何使用。