Question

我需要在同一行中对齐两个文本字段，但一个在左侧，另一个在页面中心。我试过这个：

    <div class="pure-g margin-1-0">
            <div class="pure-u-1-4">
                <label for="tipologia"> 
                    <fmt:message key="label.table.lavorazioni.spese.tipologia"/> 

                </label> 

                <s:textfield cssClass="pure-u-23-24 required"  size="35"  name="" id="tipologia" /> 
            </div>
            <div class="pure-u-1-4" style="align:center">
                <label for="valore"> 
                    <fmt:message key="label.table.lavorazioni.spese.valore"/> 

                </label>

                <s:textfield cssClass="pure-u-23-24 required" size="35"  name="" id="valore" /> 
            </div> 
        </div>

但我看到左边的一个正确，但另一个仍然在第一个旁边而不在中心。

有什么建议吗？

Answer 1

要对齐容器内的元素，请使用text-align css规则。 Struts2标签使用主题在表单中生成其他内容。所以它可以打破最初的设计。

   <div class="pure-g margin-1-0">
            <div class="pure-u-1-4"  style="text-align:center">
                <label for="tipologia"> 
                    <fmt:message key="label.table.lavorazioni.spese.tipologia"/> 

                </label> 

                <input type="text" class="pure-u-23-24 required"  size="35"  name="" id="tipologia" /> 
            </div>
            <div class="pure-u-1-4" style="text-align:center">
                <label for="valore"> 
                    <fmt:message key="label.table.lavorazioni.spese.valore"/> 

                </label>

                <input type="text" class="pure-u-23-24 required" size="35"  name="" id="valore" /> 
            </div> 
        </div>

JSFiddle

如何对齐两个文本字段

1 个答案: