Opacity leva a imagem um pouco para o lado

[José da Silvasauro 7]

É um detalhe bem bobinho porém está me encomodando...

 

Eu coloquei opacity como hover em uma transição lenta em uma imagem.

 

a {
	opacity: 0.9;
	filter:alpha(opacity=90); /* For IE8 and earlier */
	transition: opacity 0.3s ease 0s;
}
a:hover, a:focus {
	opacity: 1;
	filter:alpha(opacity=100); /* For IE8 and earlier */
        transition: opacity 0.3s ease 0s;
}

Quando se coloca o mouse em cima ocorre tudo certo, mas meio que a imagem se redimenciona diminuindo um pouco para o lado e quando o mouse sai ela aumenta denovo.

 

Já aconteceu com alguem?

 

Obs: Só testei no Mozilla.

[comicsans 0]

Cara, acho que é porque você esta fazendo uma transição e pelo que vejo não ta pegando ela assim na tua div, só quando faz o hover, por isso da uma mexida.

 

Abraço

[José da Silvasauro 7]

Como assim? Não entendi, o hover está nas imagens.

[Maujor 144]

Você fala em transição de imagem e coloca somente um código de link.
Não há como analisar assim.

[José da Silvasauro 7]

<a href="pagina.html" ><img src="img/foto.jpg" /></a>

É esse codigo numa imagem, so isso...

 

Mas venho reparando que outros sites que colocaram apenas opacity na imagem ela acaba andando tambem. O melhor jeito eh colocar um background em cima da imagem e ele sim com opacity.

[Maujor 144]

Definir efeito de opacidade, com uso de CSS, no evento hover de uma imagem link NÃO causa deslocamento algum na imagem.

 

Veja nesse link a prova: http://jsfiddle.net/v2gzg/

 

O que está causando o deslocamento da imagem não é a opacidade e sim outro fator que só pode ser determinado com o código completo da página.

Você cita "outros sites" que isso acontece. Poste o link para esses "outros sites" e informe qual é a imagem que está deslocando.

[José da Silvasauro 7]

Aqui um exemplo do que acontece:

http://weare1910.com/

 

Repare nos quadradinho em baixo da imagem maior depois que sai do hover.

[Wanderson Valerio 102]

Defina os atributos width e height da imagem e veja se o problema persiste...