将 Wordpress megamenu 子菜单拆分为两列

如何解决将 Wordpress megamenu 子菜单拆分为两列

我通过添加类 mega-menu 在 wordpress 中创建了一个 megamenu。足够简单。我的第一个子菜单有 18 个项目，它们出现在一个列中。我想将此列拆分为 2 列。我将类子菜单列应用于子菜单顶部项并尝试了以下代码，但没有任何改变。有什么建议吗？

.sub-menu-columns ul.sub-menu li {
display: inline-block;
float: left;
width:200px;
}

.sub-menu-columns ul.sub-menu li:nth-child(odd) {
    float: left;
    margin-right: 10px;
}

.sub-menu-columns ul.sub-menu li:nth-child(even) {
    float: right;
}

谢谢

解决方法

为什么不试试 flex？

.sub-menu-columns ul.sub-menu{display:flex} 
.sub-menu-columns ul.sub-menu li{flex: 0 50%}

可以在此处找到更多信息以进行微调。 CSS flexbox