This demo shows how far I got with trying to rotate the 'Supercube' a full 360 degrees without using 'transform-style: preserve-3d;' which is not supported in Internet Explorer.
This works more or less correctly in IE10, IE11 and Firefox, but has 'bugs' when viewed in Chrome, Safari and Opera which show flashes of 'hidden' faces.
If you consider this is not a true 3D image you can see how complicated it gets to spin each element around a ceter point. The code and stylesheet are extremely complex when compaired to that required when you can use 'transform-style: preserve-3d;' see the next demo (coming soon).
The animation is smooth in IE10, IE11, Chrome, Safari and Opera and a little jerky and jagged in Firefox.
Because of all the time and effort spent in producing this demonstration I would ask that you respect my copyright.
Your donations keep CSS PLAY running.
If your donation is for the use of a demo then please email me with the demo url after making your donation.