css - 使用 CSS 样式化表单

Question

我想在我使用 CSS 设计的网站上设置表单样式。我试图调整标签的宽度，但没有改变。这是我的代码:

<h3>Contact Form</h3>
<div>
    <label for="form1_name">Name</label>
    <input id="form1_name" name="name" type="text" required="required" />

</div>

<div>
    <label for="form1_email">Email</label>
    <input id="form1_email" name="email" type="email" placeholder="you@company.com" required="required" />


</div>

<div>
    <label for="form1_email">Telephone</label>
    <input id="form1_telephone" name="telephone" type="text" />
    </div>


<div>
    <label for="form1_message">Comment</label>
    <textarea id="form1_message" name="message" cols="30" rows="4" required="required"></textarea>

</div>

<div>
    <input id="form1_submit" name="submit" value="Send" type="submit" /><input type="hidden" name="cms-form" value="Y29udGFjdDpwZXJjaF9mb3JtczovdGVtcGxhdGVzL2NvbnRlbnQvY29udGFjdC5odG1s" />
</div>


</form></div>

这是我的CSS: #联系标签{ 宽度:200px !重要；

但这并没有改变我的标签的宽度。我究竟做错了什么？这是页面的链接:http://ridgesideredangus.com/about.php

Answer 1

#contact label {display: inline-block; width: 200px;}

标签默认是行内元素。除非将它们设置为 block 或内联 block ，否则无法添加尺寸。