下面是我的代码。实际上，我是在标题导航中单击时显示儿童列表（分为2个部分）。
<ul class="nav navbar-nav" data-sly-list.level1="${header.mainNavPages}" >
<div class="col-md-3 col-sm-4">
<ul class="dropdown-list" data-sly-list.level2="${level1.children}">
<li data-sly-test="${level2List.index <= level1.mainNavForkIndexValue}"></li>
-----------
</ul></div>
<div class="col-md-3 col-sm-4">
<li data-sly-test="${level2List.index > level1.mainNavForkIndexValue}"></li>
----
</ul></div>
现在我的要求是，我想在3个部分中显示相同的结果，我想将孩子列表分为3个部分（3个div）。
前2个部分（第一部分为50％，第二部分为50％）
"${level2List.index <= level1.mainNavForkIndexValue}", ${level2List.index > level1.mainNavForkIndexValue}">
现在3个部分（30,30,40或33,33,34％）
我需要就如何实现这一目标提供明显的条件。
答案 0 :(得分：0)
您可以将css用作容器div。尝试使用flex，然后相应地设置样式。
这是同一篇文章 https://css-tricks.com/snippets/css/a-guide-to-flexbox/
答案 1 :(得分：0)
您可以使用引导网格系统显示三列。您可以查看以下链接： https://www.w3schools.com/bootstrap4/bootstrap_grid_basic.asp