3D Box using CSS Pseudo-elements

The sides of a 3D box can be generated with pseudo-elements without polluting the DOM with unnecesary elements. CSS transforms also apply to pseudo-elements.

Using the ::nth-pseudo selector the odd and even sides of the box are colored distinctly.

This demo requires a browser supporting CSS transforms. Try a WebKit nightly build.