Problema Inesperado con plano 3D en CSS3

[Albuss]

Buenas,

Me he encontrado con un problema inesperado al estar trabajando usando la propiedad transform de CSS3,
Intentare ser lo mas simple y efectista posible. [Trabajando sobre chrome]. abajo he puesto dos imagenes,
el fondo verde es el div sobre el que se encuentra el plano y tiene las siguiente propiedades :

Código:

	#Space {
	
		background:hsla(120,100%,50%,1);
                width:1920px;
                height:1080px;
		-webkit-perspective: 2000;
		-webkit-perspective-origin: 50% 50%;
	
	}

El plano (rectangulo) del cual vemos solo los bordes tiene la siguiente propiedades:

Código:

.wall {
		
		  position: absolute;
		  border:1px solid hsla(0,0%,0%,1);
                  -webkit-transform-style: preserve-3d;
		  
}

Mi problema es el siguiente, por que tan solo con una diferencia de 2 grados respecto al eje Y , uno de los lados del rectángulo desaparece?

Código:

 -webkit-transform:rotateY(58deg);

Código:

 -webkit-transform:rotateY(60deg);

Quizas no he estudiado todas las propiedades que afectan a la visualizacion 3D en CSS3? , si es asi, me alegraria que alguien me dijese que se me escapa a la hora de manipular elementos en las tres dimensiones con CSS3

[Albuss]

En serio, de las pocas veces que veis que alguien se esfuerza en explicar de forma exlicita su problema y nadie me ayuda? he puesto todo, código y fotos ¿que mas se puede pedir para que me ayudéis?

[pzin]

Con ese código no se puede reproducir el problema. Pon el CSS y HTML tal cual lo tengas.

Y no es de las pocas veces que alguien se esfuerza en explicar, normalmente la gente se explica bien e incluso dejan un código funcional para reproducir el problema. Aparte de eso, un fin de semana hay menos actividad en el foro.

[Albuss]

Pero es que es asi de simple, en un plano 3D , un rectangulo con 3000 o 4000 px de largo, si le aplicas una transformacion de rotar en un punto x o y , algunos lados desaparecen.

[hackjose]

Para empezar transform-style: preserve-3d;
va en el elemento padre para que los childs sean posicionados en 3d

Cuanto mide el elemento interno

[Albuss]

Iniciado por hackjose

Para empezar transform-style: preserve-3d;
va en el elemento padre para que los childs sean posicionados en 3d

Cuanto mide el elemento interno

No hay elemento interno, es un plano 2D por lo que lo de reserve 3D es irrelevante , si quisiera hacer un cubo o algo con produndidad si, pero estoy hablando de un plano 2D , con alto y ancho , no profundidad. El plano,que reitero es ese rectangulo de bordes negros, mide 2000 px de largo.


es como si el body tuviese un limite finito y cuando el plano supera ese limite se deja de representar su figura (sus bordes negros) ¿hay algo relacionado con eso que deba saber?



Ps. emularlo es muy facil, en serio, dentro del body cread un Div con un largo de 2000 ,4000 o 6000 px , dadle una transformacion de rotacion sobre Y de 50, 60 o 70 deg . (bajo valores -webkit-perspective: 2000; y -webkit-perspective-origin: 50% 50%;). yo ya lo he hecho muchas veces y siempre igual, es como si hubiese un limite para la figura. en un valor dado para su rotacion algunas partes de la figura no se ven, es ese limite que describo.