输入文本框和标签 - 如何让它们平等？

Question

所以我想输入文本框以及它们的描述，并且我希望每个文本框的长度都是相等的。例如像，我想有一个文本框，将是这样的：

Username: [    ] 

但是，可以说，我也有一个输入文本框上面写着：“OS：”

我想它是这样的：

Username: [    ] 
OS:  [    ] 

而且我想这是为表内每一个输入字段真（？或者没有在表中，我不知道）

我将如何做到这一点？

编辑：

我有多个领域，所有这些我想是一样的长度，即：

Username:  [    ]  Machine Name: [    ] 
OS:   [    ]  Model:  [    ] 

这里是我的代码：

<form action="addrecord.psp" method="get"> 
<table> 
<tr><td>Username: <input type="text" name="uname" size="12"/></td> 
<td>Machine Name:<input type="text" name="mname" size="8" /></td> 
<td>Make: <input type=text" name="make" size="8" /></td> 
<td>Model: <input type="text" name="model" size="8"/></td> 
<td>Service Tag: <input type="text" name="service" size="8"/></td></tr> 
<tr><td>Processor: <input type="text" name="processor" size="12"/></td> 
<td>Processor Speed: <input type="text" name="speed" size="4"/></td> 
<td>Amount of RAM: <input type="text" name="ram" size="3"/></td> 
<td>Type of RAM: <input type="text" name="ram2" size="4"/></td> 
<td>RAM Speed: <input type="text" name="rspeed" size="4"/></td></tr> 
<td>Graphics Card: <input type="text" name=graphics" size="8"/></td> 
<td>Wired Mac Add: <input type="text" name="wired" size="17"/></td> 
<td>Wireless Mac Add: <input type="text" name="wireless" size="17"/></td></tr> 
<tr><td>OS: <input type="text" name="os" size="12"/></td> 
<td>Deploy Date: <input type="text" name="deploy" size="12"/></td> 
<td>Last Check-up: <input type="text" name="checkup" size="12"/></td> 
<td><input type="submit" value="Submit" /></td></tr> 
</table> 
</form> 

我不吨相信我的新形式，现场提交正确，我得到以下回调：

Tra ceback（最新最后调用）：

文件 “/usr/lib/python2.7/dist-packages/mod_python/importer.py”，线1537，在HandlerDispatch 默认= default_handler，ARG = REQ，沉默= hlist.silent）

文件 “/usr/lib/python2.7/dist-packages/mod_python/importer.py”，线1229，在_process_target 结果= _execute_target（配置，REQ，对象，ARG）

文件 “/usr/lib/python2.7/dist-packages/mod_python/importer.py”，线1128，在_execute_target 结果=对象（ARG）

文件 “/usr/lib/python2.7/dist-packages/mod_python/psp.py”，管线337，在处理程序 p.run（）

文件“/usr/lib/python2.7/的dist-包/ mod_python的/ psp.py /var/www/inventory/addrecord.psp “第34行，在 VALUES（％S，％”，线路243，在运行中 GLOBAL_SCOPE

文件EXEC代码” s，％s，％s，％s，％s，％s，％s，％s，％s，％s，％s，％s，％s，％s，％s，％s，％s，％s， ，mname，make，model，service，processor，speed，ram，ram2，rspeed，graphics，wired，wireless，os，deploy，checkup））

“/usr/lib/pymodules/python2.7/MySQLdb /cursors.py“，第1行74，在执行 self.errorhandler（self，exc，value）

文件“/usr/lib/pymodules/python2.7/MySQLdb/connections。PY” 36行，在defaulterrorhandler 提高errorclass，errorvalue

OperationalError：（1048， “列 '用户' 不能为空”）

Answer 1

更有效的方式来做到这一点：

<style> 

fieldset { 
    overflow: hidden; 
    margin-bottom: 5px; 
    display: inline-block; 
    width: 270px; 
} 

label { float: left; width: 120px; } 

input { width: 120px; } 

</style> 

<fieldset> 
    <label for="username">Username:</label> 
    <input type="text" id="username" /> 
</fieldset> 
<fieldset> 
    <label for="mname">Machine Name:</label> 
    <input type="text" id="mname" /> 
</fieldset> 
<fieldset> 
    <label for="os">OS:</label> 
    <input type="text" id="os" /> 
</fieldset> 
<fieldset> 
    <label for="model">Model:</label> 
    <input type="text" id="model" /> 
</fieldset> 

这样，您还将重点领域那么他们的标签被点击焦点光标

例：http://jsfiddle.net/6SVp7/1/