0

下面是我的代码。实际上,我在标题导航中单击时显示儿童列表(在 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%)

我需要关于如何实现这一目标的建议。

4

2 回答 2

0

您可以使用引导网格系统来显示三列。您可以查看以下链接: https ://www.w3schools.com/bootstrap4/bootstrap_grid_basic.asp

于 2019-06-03T07:33:57.440 回答
0

You can use css for the container div. Try using flex and then style accordingly.

Here's an article on the same https://css-tricks.com/snippets/css/a-guide-to-flexbox/

于 2019-06-03T06:26:52.677 回答