如何在 Materialise 的一行上对齐两个输入文本？

Question

我想在 Materialize.css 上将两个输入文本居中，但是当我尝试这样做时结果并不好。那是代码：

<div class="card-content valign center">
    <div class="row">
        <form class="col s12">
            <div class="row">
                <div class="input-field col s3">
                    <input id="Valor1" type="text" class="validate" maxlength="10">
                    <label for="Valor1">Valor 1</label>
                </div>
                <div class="input-field col s3">
                    <input id="Valor2" type="text" class="validate" maxlength="10">
                    <label for="Valor2">Valor 2</label>
                </div>
            </div>
        </form>
    </div>
</div>

这里有很多文本字段，例如：Materalize Text Fields

Answer 1

为了使输入居中，您可以将 offsets 添加到第一列：

<div class="input-field col s3 offset-s3">
    <input id="Valor1" type="text" class="validate" maxlength="10">
    <label for="Valor1">Valor 1</label>
</div>

您的行的总长度为 12 列。您的两个输入共有 6 列。通过在左侧偏移 3 列，您可以获得所需的元素居中。