Ao clicar no link da resposta aparece a janela do Dabblet, porém sem nenhum conteúdo. Como faço para visualizar o código da resposta?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Ao clicar no link da resposta aparece a janela do Dabblet, porém sem nenhum conteúdo. Como faço para visualizar o código da resposta?
Boa tarde, Diogo! Tudo bem, cara? =)
Que estranho... Você pode conferir que o link que está abrindo é esse aqui: http://dabblet.com/gist/70a44631ea6fdab54962 ?
Mas se quiser testar depois, esse é o HTML:
<div class="cubo">
<div class="face frente"></div>
<div class="face direita"></div>
<div class="face esquerda"></div>
<div class="face cima"></div>
<div class="face baixo"></div>
<div class="face tras"></div>
</div>E esse é o CSS:
.face {
display: block;
width: 200px;
height: 200px;
position: absolute;
top: 0;
left: 0;
}
.frente {
background-color: red;
transform: translateZ(100px);
}
.direita {
background-color: blue;
transform: translateX(100px) rotateY(90deg);
}
.esquerda {
background-color: green;
transform: translateX(-100px) rotateY(-90deg);
}
.cima {
background-color: yellow;
transform: translateY(100px) rotateX(90deg);
}
.baixo {
background-color: magenta;
transform: translateY(-100px) rotateX(-90deg);
}
.tras {
background-color: cyan;
transform: translateZ(-100px) rotateY(180deg);
}
.cubo {
transform-style: preserve-3d;
width: 200px;
height: 200px;
position: relative;
top: 100px;
left: 100px;
transform: rotateX(10deg) rotateY(10deg);
}Espero ter ajudado, mas qualquer dúvida não deixe de postar aqui para que possamos ajudá-lo!
Abraço e bons estudos,
Fábio