你如何解决IE，Firefox和Chrome之间的这种不一致问题

Question

我在网页上有一张背景图片，我正在将一张图片放在我的身体上以排列图像：

这是我的css：

背景

body {
 font: 12px tahoma, Arial, Helvetica, sans-serif;
 line-height: 1.5em;
 margin: 0px;
 padding: 0px;
 color: #241a10;
 background:#c9e4ec url(/Content/images/myImage.gif);
}

图片：

#leftSideContainer {
    position:relative;
    margin-top:-47px;
    width:147px;
    height:93px;
    background:url(/Content/Images/image2.gif);
}

在IE7和Chrome中，它看起来很完美并且准确排列：

但是在IE8和Firefox中，与背景图像相比，图像显示略低一些：

如果它只是一个旧版本的IE破坏了我不在乎，但在这种情况下，Firefox也被打破了。

我试过玩：

 margin-top: -47px;

但是如果我将它移到更高的位置以使其在Firefox中排队，那么它们显然看起来与其他浏览器不对齐。

对可能导致这种差异的任何建议。？

Answer 1

CSS重置是你的朋友

http://meyerweb.com/eric/tools/css/reset/

  

重置样式表的目标是减少浏览器在默认行高，边距和标题字体大小等方面的不一致性。