对齐表单输入框?

3
我这里有一个示例:http://jsfiddle.net/3zSbt/ 我不知道如何使我的输入框彼此对齐...
非常感谢任何帮助。 HTML
<div id="contactContent">
 <form>
 Email: <input type="text" name="firstName">
 <br>
 Subject: <input type="text" name="lastName">
 </form>
</div>

CSS

#contactContent { margin-top: 50px; margin-left: 300px;}
input { border: none; margin-left: 50px; margin-bottom: 30px; padding-right: 50px;}

2
有很多种方法。这里是一个示例 - Vucko
无论哪种方式都可以,只要它看起来像你的示例。你应该将其作为答案,这样我就可以勾选它了。 :) - Zevoxa
2个回答

13

有很多方法。一种方法是将您的值名称放在

HTML

<label>Email:</label><input type="text" name="firstName" />
<br />
<label>Subject:</label><input type="text" name="lastName" />

CSS

label{
    display:inline-block;
    width:100px;
}

JSFiddle


1
如果您想使用HTML,可以尝试将其放在表格中;如果您只想使用CSS,您是否尝试过这个方法:
input {
    display:inline-block;
    float:left;
}

试图避免使用表格。 - Zevoxa
好的,但是希望CSS对你有帮助。 - Daniel Morgan

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接