在 flexbox 中向右浮动

Question

我想使用 flexbox 在 React 的右侧创建垂直导航栏，中间是我无法访问的登录元素。问题是使用 justify-content: flex-end。元素移到右侧，但登录元素位于下方而不是中心。

我尝试使用位置：绝对，继承。但是登录元素会重叠。我也尝试过使用 z-index，但它是相似的。 z-index -1;适合登录，不适合导航栏。 z-index 10：适合导航栏，不适合登录。

通常我只会在导航栏上使用 float: 并完成它。但我想知道是否有使用 flexbox 的解决方案。

Answer 1

我不认为 flexbox 是适合这种布局的工具。可能是，如果登录表单相对于导航栏留下的空间居中（这可能比相对于整个身体居中更有意义）。在这里，导航栏似乎确实是float: right 或position: fixed。此处指定的布局对于较小的屏幕尺寸不可避免地会发生重叠，所以是的，您需要定义发生这种情况时的行为。