Css 调整窗口大小时元素相互重叠

我在网站中有一个标题部分，包括：

• 标志
• 登录、注册按钮
• 菜单
• 语言选择器

我想将它们放在一行中，但问题是当我调整窗口大小时，它们彼此重叠，特别是登录按钮与徽标重叠，语言选择器与主菜单重叠

<div id="header-container" class="container">
  <div id="header-container-nav" class="row align-items-center">
    <div class="col-md-3">LOGO</div>
    <div class="col-md-1">LOGIN BUTTONS</div>
    <div class="col-md-5">MENU</div>
    <div class="col-md-1">LANGUAGE</div>
  </div>
</div>

标志
登录按钮
菜单
语言

我将使用

flex

我会使用这个HTML

  <div id="header-container-nav">
    <div">LOGO</div>
    <div>LOGIN BUTTONS</div>
    <div>MENU</div>
    <div>LANGUAGE</div>
  </div>

---

现在，您可以调整每个项目的大小（查看本文）

是的，但我希望元素在调整大小时进入一列。您可以使用媒体查询，然后更改flex方向谢谢，这很有帮助。我确实解决了我的问题，一个引导和这个组合。哦，没关系，这在IE上不能正常工作：（你想检查什么IE版本？很抱歉，回复晚了，但我正在检查IE 11。

#header-container-nav {
  display: flex;
}