我有一个非常简单的网络表单，它由标签和输入字段组成，但是我似乎无法找到一种方法来将表单对齐到页面的中心，并使标签具有相同的宽度，以便它们出现彼此整齐地挨着，一个在另一个下面。我的页面结构基本上是:
<body>
<div class="form">
<form method="post">
<fieldset>
<label>Mobile:</label><input type="text" name="msisdn"><br/>
<label>Code:</label><input type="text" name="code"><br/>
<br/>
<input type="image" src="submit-button.gif" alt="Submit">
<br/>
<input type="checkbox" name="ts_and_cs"><label> Accept Terms and Conditions</label>
<br/><br/>
</fieldset>
</form>
</div>
</body>
通常我会通过在标签字段上执行 float:left 并在标签上设置宽度来解决这个问题，但是为此我需要标签和输入字段在页面上居中。此外，我无法设置页面(或任何包含 div)的宽度，因为页面将显示在具有不同屏幕尺寸的移动设备上。
关于如何最好地设计表单有什么建议吗？谢谢
最佳答案
试试这个 CSS:
.form { margin: 0 auto; }
.form label { display: inline-block; width: 150px; } /* Replace the width here with what you want */
关于html - 具有等宽标签的居中对齐表单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2649319/