虽然所有图像都具有相同的样式和大小，但Firefox会在多个图像中为第一个图像添加填充

Question

嘿伙计们，我有这段代码：

while($uno=mysql_fetch_assoc($results)) {
    echo '<div class="wcapt"><a class="neutral" href="../images.php?id=' . $uno['id'] . '"><img class="pad" src="'. $uno['thumbs'].'" border="0" /></a><br/><center><p>'.$uno['name'].'</p></center></div>';
}

我链接的所有图片都具有完全相同的大小。这是Mainstyles.css

div.wcapt
{
    border: 1px solid green;
    float: left;
    padding: 0;
    margin: 3px;
    font: 11px/1.4em Arial, sans-serif;
    color: gray; 
    }
img.pad
{
    padding: 5px;
    }
a.neutral
 {
    display: inline;
    font-weight: normal;
    text-transform: none;
    background-color: transparent;
    color: white;
    text-decoration: none;
    }   

问题在于Firefox为第一张图片添加了一些额外的填充，而只添加了第一张图片。而这真的很烦人。这是该页面的屏幕截图：

Answer 1

这就是为什么建议使用"reset" css ...所以你不会在浏览器之间出现这种类型的不一致。

尝试使用重置css，如果问题仍然存在，则不是浏览器故障=）

祝你好运

Answer 2

您是否尝试使用..

更明确地定位选择器

div.wcapt img {
  padding: 5px;
}

然后您可以完全删除.pad类

尝试在此处添加伪选择器更多信息 http://www.w3schools.com/CSS/css_pseudo_classes.asp 请注意，您需要设置doctype来执行此操作

div.wcapt img:first-child {
padding: 2px;
}

Answer 3

我使用了Firebug并想出了问题，谢谢大家，我不得不回答我的问题，因为答案在评论中，我不能接受评论答案。