IE6 <input type =“text”/>宽度问题

Question

我有一个烦人的IE6布局错误

此屏幕截图显示了问题：

问题：文字输入，即<input type='text' />尺寸错误。

文字输入有点不稳定。它们应该是248px宽（像textarea）并且与它们的标签处于相同的水平面上。所有其他浏览器似乎遵循以下代码，但我们的朋友IE6不

.simple_form input[type='text'],.simple_form input[type='email'],.simple_form textarea
  {
    width:240px;
    border:1px solid #ccc;
    padding:3px
  }

我不知道我在这里做错了什么，这让我疯了。有问题的页面是here。 IE6中的输入明显宽于248px。在CSS中使用时，IE6是否有理解input[type='text']的问题？

可以发布更多代码

Answer 1

IE6不支持CSS中的attribute selector。

您将使用IE6兼容方式选择这些元素，例如类。

Answer 2

除了之前的答案，还要记住将css选择器保留在单独的选择器中。例如，

input[type="text"], input.text {
  color: red;
}

IE6将完全忽略这一点。但...

input[type="text"] {
  color: red;
} 
input.text {
  color: red;
}

应该有用。

Answer 3

IE6不支持CSS属性选择器。请尝试使用以下选择器：

.simple_form input.text {
  ...
}

此外，请记住box model for IE6中的差异。

Answer 4

是的，我的红头小孩，根据我的经验，不能很好地解决属性问题。而是做像

这样的事情

.input {/*your styles*/}

它不仅可以适应浏览器，而且通过css重置，你会发现浏览器也是持久的。