Ah, pues lo siento, no sabía que no podías poner imágenes.
Siempre el asunto del explorer con los márgenes de la imágenes y cosas de esas es un coñazo tremendo. No sé si definitivamente lo quieres hacer así, mezclando imágenes insertadas con otras en background, o es ya una cuestión de amor propio
.
A mi lo único que se me ocurre es usar un comentario condicional para IE y darle una clase al elemento li que llevará imagen incrustada:
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Lista</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<style>
body { background-color: rgb(255, 204, 255);
margin-top: 20px;
margin-left: 20px;
}
#menu { margin: 0px;
padding: 0px;
list-style-type: none;
list-style-image: none;
}
#menu li {border: 1px solid white;
padding: 0px;
width: 217px;
height: 54px;
}
#menu li a.enlace { width: 217px;
height: 54px;
display: block;
position: relative;
background-image: url(boton.jpg);
background-repeat: no-repeat;
}
li img { float: left;
}
</style>
<!--[if IE]>
<style>.imagen {margin-bottom: -4px;}</style>
<![endif]-->
</head>
<body>
<ul id="menu">
<li class="imagen"><img src="boton.jpg"
hspace="0"></li>
<li><a href="#" class="enlace"> </a></li>
</ul>
</body>
</html>
Había puesto ese margen antes para que con la distancia se viera bien la diferencia, y no sabía que querías que fueran pegadas.
A ver si esto te sirve de algo, aunque igual hay que concretar en el comentario qué versión de IE, porque no sé si en el 7 también se producía este problema.
Mikel.