在字段集中居中和对齐元素

Question

我目前有一个字段集，它必须占用我容器的 96%。此字段集必须使他的元素居中但也对齐，例如，所有标签必须在同一位置结束，所有输入必须从同一位置开始。

这很容易，没有这段代码的整个中心问题 (JSFiddle)：

.formulaire
{
    margin: 1em auto;
    border-style: solid;
    border-width: 1px;
    border-color: #B0B0B0;
    padding: 1em;

}

.formulaire label
{
    float: left;
    width: 25%;
    text-align: right;
}

我尝试将我的字段集放在带有文本居中对齐的 div 中，但它只是将所有内容居中而不对齐任何内容。

任何帮助将不胜感激

谢谢！

Answer 1

是的，您可以将表单字段包装在一个 div 中，将宽度设置为最长的标签/字段组合，然后使用 margin:0 auto; 将该 div 居中

Here is the example