Solucionado
Não ficou claro pra mim! Gostaria de saber dos colegas qual a real necessidade do elemento com translate(6.5765em, -2.4745em) ?
Por que o meu funcionou sem o translate com essas configurações abaixo ?
.tarja a { font-family: 'Shadows Into Light'; color : #c51844; background-color: #fff; padding: .5em; border: 0.3em solid #000; width: 60ch; text-decoration:none; position: absolute; top: 4.6%; left: 80%; transform: rotate(38deg); text-align: center;
}
body { overflow-x: hidden; }
Duvida resolvida , oh meu Deus onde estava com a cabeça . Acontece que so estava pensando nos efeitos visuais em duas dimensões, porém provavelmente também aplicar transformações 3D para este elemento (tarja) eixo Z. Para sanar ainda minha duvida e aproveitar que vc esta aqui tentando me entender : - E possivel aplicar efeito 3D nas configurações do meu post anterior ? ( pois não usei translate eixo x,y para posicionar a tarja ).
Eluan no seu exemplo a translação é feita apenas no eixo X e Y, pois a regra translate recebe dois argumentos, o primeiro referente ao eixo X e o segundo referente ao eixo Y:
translate(x,y)Caso queira realizar um translate em 3D você deve usar translate3d onde recebe três parâmetros, os dois primeiros são iguais, porém o ultimo é referente ao eixo Z:
translate3d(x,y,z)Espero ter ajudado.