rollover en borde de imagen

[angelseron]

buenas estoy tratando de que me funcione esto

css:

#foti img {
margin: 0px 13px 12px 0;
}

A:link img, A:visited img {
BORDER: #fff 1px solid;
}
A:hover img {
BORDER: #000000 1px solid;
}

htm:

<div id="foti">
<a href="#"><img src="images/photos/puno/foti1-puno.jpg" alt="puno1" border="0" /></a>
<a href="#"><img src="images/photos/puno/foti2-puno.jpg" alt="puno2" width="55" height="48" border="0" /></a>
</div>

En la primera creo los espacios para las imagenes una de otra
En las siguientes que trata sobre el link a la imagen estoy haciendo que al pasar mouse sobre la imagen cambie color de borde de blanco a negro, esto me funciona bien en firefox pero en IE no se muestra el over.

que me falta para que funcione en IE.

gracias

[caricatos]

Hola:

En explorer los pseudo estilos solo funcionan en los enlaces, y en este caso creo que sería lo mismo aplicar el efecto al link solamente (a:link, a:hover, a:visited)

Saludos

[fearlex]

Eso que planteas, puede que te sirva en IE7, pero en el 6 solo se pueden aplicar las seudo clases a los links (a). De todas formas como dice Caricatos, con el link solamente deben funcionar, pero te incluyo al que te servira:


#foti img {
margin: 0px 13px 12px 0;
}

a{
display: block;
}
a:link , a:visited{
border: #fff 1px solid;
}
a:hover, a:active{
border: #000000 1px solid;
}

htm:

<div id="foti">
<a href="#"><img src="images/photos/puno/foti1-puno.jpg" alt="puno1" width="55" height="48" /></a>
<a href="#"><img src="images/photos/puno/foti2-puno.jpg" alt="puno2" width="55" height="48" /></a>
</div>

Quite la propiedad border="0" del codigo HTML, si le estas diciendo que no quieres borde, luego intentas imponerselo con CSS, eso puede dar conflicto.
Pruebalo y nos dices si te funciono

[safe]

hola...

Fearlex: no creo que haya que agregarle display:block... ya que solo cambia la "dispocion" de los elementos, pero no es es necesario para que el hover funcione.