物化导航内容不会居中 ul 元素

Question

我正在尝试使用 center 选项将导航内容居中

So it will look like this.

但是它不适用于 ul 属性。

Ends up looking like this instead.

我的代码：

...
        <div class="nav-content center" style="background-color: black">
            <ul class="tabs tabs-transparent">
                <li class="tab"><a href="">Test 1</a></li>
                <li class="tab"><a href="">Test 2</a></li>
            </ul>
        </div>
    </nav>

解决方案：

mdubus 的回答是正确的，但它需要在 ul 元素而不是 div 中才能使用 Materialize。

Answer 1

在您的 div nav-content center 上，只需添加一个 display:flex; justify-content:center;。这应该可以解决问题;)

Answer 2

我不熟悉 materielize，你可以用 css 来做，通过将父元素设置为：flex 和 justifiy-content: center;或者简单地通过设置 .nav-content{ text-align: center; }