bootstrap 4 navbar collapsed div在激活时移动所有标题菜单

Question

我一直在使用bootstrap 4从3.x进行迁移而且现在一切正常，除了我的标题有一个问题，我有一个折叠的div，用于搜索，哪一个被激活时移动所有菜单并不是一个非常好的用户体验（请忽略屏幕截图中的丑陋边框，它们仅用于调试目的。）

这是正常的菜单

当我点击搜索图标

时

我有另一个Div与搜索表单

如果我们仔细观察，我们可以看到前一个div的大小更大，所有项目都移到了左边

更新：

这是一个问题的动画GIF：

https://i.gyazo.com/a19328136dea86aebf6566972d7855e5.mp4

以下是带有HTML布局代码的Gist：https://gist.github.com/ricardojriosr/1aa3f0c77c4d6786b42cce6d03a9c154

我该如何解决这个问题，所以菜单不会改变大小并向左移动项目？提前谢谢。

Answer 1

您可以尝试添加

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  transition: height .35s ease;
}

在你的CSS中

。