IE 8 compatibility mode

I have the following problem:

My css is the following:

.SPImage img
 {
    margin-top:-15px;
    float:left;
    white-space:normal;
    width:194px;
    height:149px;
 }

my HTML is the following:

<DIV id=SPImage class=SPImage>

<DIV style="POSITION: relative; WIDTH: 100%">
<IMG style="WIDTH: 165px; MARGIN-LEFT: 15px" title="test" alt="test" src="/resources/2710004.jpg">
</DIV>
</DIV>

I have the following setting in HTML head tag:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

my problem is that when I'm using IE 8, I have image raised up to 15px due to margin-top:-15px; when using IE 7 and IE8 in compatibility it appears just ok. I can't remove margin-top:-15px; because it will look ugly in IE 7.

How can I solve开发者_运维技巧 this issue?

---

When i do this:

CSS:

.SPImage img {
    margin-top:-15px;
    float:left;
    white-space:normal;
    width:194px;
    height:149px;
}

HTML:

<DIV id="SPImage" class="SPImage">
    <IMG style="WIDTH: 165px; MARGIN-LEFT: 15px" title="test" alt="test" src="img url">
</DIV>

In IE 7, IE 8, IE9, Chrome and FF it is looking the same?