使用codeigniter时如何在fieldset中居中输入标签？

Question

我使用Codeigniter创建了一个注册页面，我想将所有元素集中在一个字段集中。

这是我的PHP代码：

<fieldset style="text-align:center">
<legend>Data</legend>

<?php
$this->load->helper('form');

echo form_open('login/create_user');
echo form_input('username', '', 'placeholder="Username"');
echo form_input('email', '', 'placeholder="Email"');
echo form_password('password', '', 'placeholder="Password"');
echo form_password('password1', '', 'placeholder="Confirm"');

echo form_submit('submit', 'Submit');
echo validation_errors();
?>
</fieldset>

CSS代码：

input[name=username], input[name=email], input[type=password]
{
display: block;
margin: 0 0 1em 0;
width: 200px;
border: 5px;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
padding: 1em;
}

input[name=submit]
{
border: none;
margin-right: 1em;
padding: 6px;
font-size: 12px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
background: #088A08;
color: white;
box-shadow: 0 1px 0 white;
-moz-box-shadow: 0 1px 0 white;
-webkit-box-shadow: 0 1px 0 white;
}

以下是这样的结果：Page，如您所见，只有“提交”按钮居中，为什么会这样？

Answer 1

input[name=username], input[name=email], input[type=password]
{
display: block;
margin: 0 auto 1em; /* change here */
width: 200px;
border: 5px;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
padding: 1em;
}

您始终可以居中显示：使用宽度和边距右侧阻止：自动，左边距：自动;