3d Demo

dabblet.css

/*
	3d Demo
*/
#wrapper{
perspective:500px;
height:100px;
background:slategray;
}
#wrapper div{
	height:100px;
	width:25%;
	float:left;

}
div{
	background:gray;
}
#wrapper div{
    background:gray;
	transform:rotateX(45deg);
	transition:transform 5s;
	border:1px solid black;
	box-sizing:border-box;
}
#wrapper div:nth-child(4n+1),#wrapper div:nth-child(4n+4){
	transform:rotateX(-45deg);
}

dabblet.html

<div id="wrapper">
<div id="one">1</div>
<div id="two">1</div>
<div id="three">1</div>
<div id="four">1</div>
</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}