html - 同名表单字段上的 css

Question

所以我在一个页面上有多个表单(不知道有多少，由 php 在数组中创建)。每一个都很简单，包含许多字段，每个字段都有一个 name='fieldname'。

现在在我的 CSS 中:

form.sidemenu input[name=fieldname] { width: 40px; }

这在表单的第一个实例上运行良好，但对其余表单中的相应字段没有任何影响。我现在尝试用每个输入字段中的特定类替换它 (input name='fieldname' class='fieldname'....) 并替换 form.sidemenu input.fieldname {宽度:40px； }，尽管第一种形式工作正常，但后续的仍然没有运气。

这是在 OSX Lion 上的 Chrome Canary 和 Safari 上，两者的行为相同。

我知道这不是什么完全愚蠢的事情(比如遗漏了表单上的类)因为(1)这是一个由 php 循环生成的表单所以它们都是一样的，并且(2)CSS 在表单的第一个实例，但在后续的实例中完全没有...

Answer 1

HTML:

<form>
    <input type="text" class="fieldname" id="name"/>
    <input type="text" class="fieldname" id="and_So_on"/>
</form>

CSS:

.fieldname {
     width: 40px;
}

或您可以尝试将表单放入 DIV 中，例如:
CSS:

div.sidemenu input {
     width: 40px;
}

HTML:

<div id="sidemenu">
    <form>
        <input type="text" class="fieldname" id="name"/>
        <input type="text" class="fieldname" id="and_So_on"/>
    </form>
</div>

这是它的样子吗？现在它将应用于整个页面上所有带有 class="fieldname" 的元素。但仅用于调试也值得一试。