CSS,n-child不起作用？

Question

我正在构建一个表单,但由于一个疯狂的原因,nth-child似乎不能在输入字段上工作.一个jsfiddle来说明问题:http://jsfiddle.net/nGuLp/.第二个输入字段不应该获得边距权限,但确实如此.为什么这不起作用？HTML:

<div class="block-inner">
<h1>Blah</h1>
<hr />
<input type="text" placeholder="Voornaam" name="firstname" id="firstname" class="left" />
<input type="text" placeholder="Achternaam" name="surname" id="surname" class="left"    />

</div>

CSS:

input {
width: 45%;
margin-right: 10%;
}

input:nth-child(2){
margin-right: 0;
}

Answer 1

您需要使用:nth-of-type(n),否则计数器会增加每个元素,.block-inner因此两个输入会产生第3和第4位置.