内联一个大型菜单

Question

我在Wordpress site工作，在那里我做了一个大型菜单。我可以在检查器窗口中看到，mega菜单所在的div标记位于navbar div标记内。

我需要将菜单放置如下图所示。我可以使用inline-block执行此操作，但菜单选项位于徽标顶部，因此徽标无法点击。

如何将我的菜单栏放在徽标和篮子之间，仍然可以点击徽标和篮子？

Answer 1

您可以在容器上使用flexbox，它将完美地定位和分隔所有内容：

header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

唯一的问题是购物车图标需要在HTML中排在第3位并删除边距