Publicado em 20 de jan.

Alterar imagem de acordo com resolução

bom dia pessoal,

tenho este site feito com tema wordpress adaptado. utilizo um widget para inserir os videos e os textos, eis o seguinte. preciso alterar a imagem da seta que aparece ao lado dos titulos (seta apontando para o video) pois no celular os videos ficam acima e nao do lado.

ou seja no tablet e pc a seta fique para esquerda e no celular fiquei para cima.

alguem sabe a solução?

obrigado

Discussão (1)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

Junior Varoni· 20 de jan.

Bom dia Gabriel,

Acrescente isso em seu css

@media only screen and (max-width: 680px) {

 .alignnone{
 -webkit-transform: rotate(-270deg);
 -o-transform: rotate(-270deg);
 -moz-transform: rotate(-270deg);
 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
 }
}

Explicação:

A @media screen é uma media query do css3, quando seu layout chegar numa resolução de no maximo 680px, esse código será executado. Apartir de 681px, esse código deixa de ser executado, voltando a seta ao seu estado original.