🥇 Rotação de imagens / divs

Atualmente estou reconstruindo meu portfólio e como parte disso estou puxando 3 imagens do Instagram, então posiciona o UL relativo e todos os LIs absolutos para que fiquem um em cima do outro.

Para obter um efeito de imagem empilhada, giro a capacidade de separação de cada uma dessas imagens usando : nth-child ()

.instagram li:nth-child(1) {
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg)
    -ms-transform: rotate(20deg);
    -o-transform: rotate(20deg)
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

O problema é o suporte para: nth-child () no Firefox 3. Se isso for um problema, simplesmente use uma classe única em vez desses 3 itens da lista e use-a em vez de nth-child.

Aqui está o resultado

Cenário

Esta é a minha primeira postagem no coderwall, espero que gostem da dica.

Related Posts