Boton Css con Imágenes PNG

[juampick]

Hola, quería comentarles que cuando agregué las imágenes en el menú, en ie se empezó a ver mal (lo corroboré recién hoy, ya que el height se va disparado enorme, lo que hice fue el truquito enseñado por Mike hace tiempo del height, les muestro el codigo a ver si me pueden decir porque no se me soluciona.
html:

Código:

<div id="header">
			<div id="logoleft"><img src="pruebalogofondopng.png" alt="logo 5+2" /></div>
			<div id="buttons">
			<ul>
			<li><a href="historia.html" class="historia"></a></li>
			<li><a href="recursos.html" class="recursos"></a></li>
		        <li><a href="index.html" class="home activo"></a></li> 
			<li><a href="contacto.html" class="contacto"></a></li> 
			<li><a href="galeria.html" class="galeria"></a></li> 		
			<li><a href="links.html" class="links"></a></li>
			</ul>
			</div>
		</div>

css:

Código:

#header {
min-height:100px;
height:auto!important;
height:100px;
margin:0 auto;

}
#logoleft {
float:left;
width:100px;
min-height:100px;
height:auto!important;
height:100px;
margin:0;
}


/*----- Buttons -----*/
#buttons {
padding:1em;
height:1.5em;
}
#buttons ul {
width: 550px;
float: right;
margin-right: 60px;
}
#buttons li {
float:right;
list-style-type:none;
white-space:nowrap;
margin-left:70px;
margin-top:3px;
}
#buttons li a {
background-position:center top; 
display:block;
background-repeat: no-repeat;
text-decoration:none;
}
#buttons li a span {
visibility: hidden;
}
#buttons li a.historia {
background: url('historia.jpg');
height:28px;
width:98px;
}
#buttons li a.contacto {
background: url('contacto.jpg');
height:28px;
width:105px;
}
#buttons li a.recursos {
background: url('recursos.jpg');
height:28px;
width:108px;
}
#buttons li a.links {
background: url('links.jpg');
height:28px;
width:55px;
}
#buttons li a.galeria {
background: url('galeria.jpg');
height:48px;
width:87px;
}
#buttons li a.home {
background: url('home.jpg');
height:28px;
width:62px;
}
#buttons li a.activo { 
background-position: center bottom;
cursor:default;
}
#buttons li a:hover { background-position: center;}
#buttons li a:hover.activo { 
cursor:default;
background-position: center bottom;
}

Espero que lo podamos solucionar. El link es el de siempre: **editado**
Gracias