css - 不明白为什么背景图片看起来不一样？

Question

我正在使用 jQuery 验证插件。我有两个图像：标签的第一个背景，当数据有效时，第二个 - 无效。

但是它们看起来不一样，具有相同的 css 属性。

这里是我的麻烦截图

这是我在css文件中的代码：

 label.error {
color:transparent;
display: inline;  
background: url('../images/not_valid.png') no-repeat;
padding: 10px;
margin-left: 5px;
width: 47px;
height: 36px;
}

label.valid {
background: url('../images/valid.png') no-repeat;
display: inline;  
padding: 10px;
margin-left: 5px;
color:transparent;
width: 47px;
height: 36px;
}

已编辑：DROPBOX 上的文件-链接

Answer 1

您应该使用您最喜欢的 dom 检查器检查这些元素，并确保在您的 css 中的其他地方没有定义其他.valid和/或.error类，这会影响您的元素的样式。我没有完全理解你的意思

使用相同的 CSS 属性，它们看起来不一样

所以我只能认为其他地方还有一些 css 会影响您的一个元素的显示。

Answer 2

好吧，图像似乎被裁剪了。所以问题似乎与background-position标签的尺寸或大小有关。