Browser compatibility issues

[gemzilla]

I have a list where I have used an image for the bullet points. It comes out fine in firefox and chrome, but explorer doesn't want to play ball and cuts the text at the bottom. Also explorer won't show the text shadow I have applied to the text. Below is the code I'm using and the website, bullet points are near the bottom.


http://euro.ismywebsite.co.uk/reach.php

CSS

.thermoinfo {
height:500px;
margin-left: 50px;
list-style-type: disc;
list-style-image:url(../Images/bullet.fw.png);
font-size:16px;
font-weight:bold;
color:#FFFFFF;
text-shadow:2px 2px 3px #000000;
}

.thermorinfo li{
margin-bottom:5px;
}

HTML


<ul class="thermoinfo">
<li>Hot water exterior window cleaning.</li>
<li>Commercial exterir building clean.</li>
<li>Monthly or quarterly visits.</li>
<li>Contact us for a free quotation.</li>
</ul>

[jscheuer1]

First thing I would try is getting rid of this meta tag:


<meta content="IE=7;FF=3;OtherUA=4" http-equiv="X-UA-Compatible" />

Newer (like 9 and up, maybe even 8) IE should then be OK.

Also I notice that the list image has a transparent section at the top making it higher than it actually appears. If it still needs to be tweaked, I would get rid of that and possibly add top and/or bottom padding to the .thermorinfo li selector.

BTW, as far as I can see, there is no:



.thermorinfo li{
margin-bottom:5px;
}

Actually having that may or may not help