Problème avec IE7

Alors voilà vous pouvez constater avec IE7 ou IE8 en mode compatibilité (donc IE7) que les deux top news de ma home (gagner des dvd des simpson et des intrus) sur MrAwesomeblog.fr sont mal positionnés sur la page avec IE7. De plus au passage de la souris sur l'un des deux encadré, leur position change et je ne comprends pas pourquoi . L'affichage est OK sur tous les autres browsers.

Voici le Code HTML de la partie en question et le code CSS:

<div class="topnews" align="center">
<ul class="gallery"> 
	<li><a href="http://www.mrawesomeblog.fr/2009/10/14/grand-jeu-les-intrus-racontez-votre-pire-cauchemar-5-dvd-du-film-a-gagner/"><span class="cine"></span><em>Cin&eacute;ma</em><img src="http://www.mrawesomeblog.fr/wp-includes/images/topactus/jeu_intrus.png" alt="image" /></a></li> 
	<li><a href="http://www.mrawesomeblog.fr/2009/10/12/grand-jeu-les-simpson-saison-12-3-coffrets-dvd-a-gagner/"><span class="tv"></span><em>S&eacute;rie TV</em><img src="http://www.mrawesomeblog.fr/wp-includes/images/topactus/simpsons12.png" alt="image" /></a></li> 
</ul></div>

/* TOP NEWS*/

.topnews{
	height:135px;
	display:block;
	clear:both;
	padding:0;
	vertical-align:top;
	margin-bottom:25px;
}
.gallery {
	list-style: none;
	margin-top: 10px;
	padding: 0;
	clear:both;
	display:block;
	position: relative;
	margin-left:30px;
}
.gallery li {
	padding: 10px;
	margin-left:30px;
	float: left;
	position: relative;
	width: 245px;
	height: 115px;
}
.gallery li:hover img {
	border-color: #8baab1;
	-webkit-box-reflect: below 0px -webkit-gradient(linear, 0 10%, 0 150%, from(transparent), color-stop(.5, transparent), to(white));
}
.gallery img {
	background: #fff;
	border: solid 1px #ccc;
	padding: 5px;
}
.gallery em {
	background: #fff;
	color: #000;
	font-style: normal;
	padding: 1px 9px 2px 47px;
	display: block;
	position: absolute;
	top: 20px;
	left: 5px;
	border: 1px solid #999;
	-webkit-box-shadow: 0 1px 5px #666;
	-moz-box-shadow: 0 1px 5px #666;
}
.gallery a {
	text-decoration: none;
}

.gallery span.multi {
	width: 35px;
	height: 32px;
	display: block;
	position: absolute;
	top: 13px;
	left: 13px;
	background: url(images/multi.png) no-repeat;
	z-index: 3;
}

.gallery span.cine {
	width: 35px;
	height: 32px;
	display: block;
	position: absolute;
	top: 13px;
	left: 12px;
	background: url(images/cine.png) no-repeat;
	z-index: 3;
}

.gallery span.tv {
	width: 35px;
	height: 32px;
	display: block;
	position: absolute;
	top: 13px;
	left: 12px;
	background: url(images/tv2.png) no-repeat;
	z-index: 3;
}