Tenho uma página com 3 divs. Uma delas recebe imagem sempre, gostaria que todas imagens ficassem nesta posição:
Como faço isso no CSS?
Stack Overflow em Português é um site de perguntas e respostas para programadores profissionais e entusiastas. Leva apenas um minuto para se inscrever.
Inscreva-se para participar desta comunidadeResolvi assim:
.vertical-img {
transform: rotate(90deg);
transform-origin: left top 0;
}
Utilize vendor prefixes para maior compatibilidade da propriedade transform.
Segundo o Can i use, atualmente você precisa utilizar epenas -webkit, -ms e a propriedade propriamente dita.
Exemplo:
.vertical-img {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
<img src="" alt="Desc Imagem" class="vertical-img">
só colocar dessa forma no seu Style que funciona,
.vertical-img {
transform: rotate(90deg);
}
mais pra garantir que vai funcionar em todos os navegadores use os assim:
.vertical-img {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}