Flipboard Page 3D

dabblet.css

/**
 * Flipboard Page 3D
 */

body {
  background: #eee;
}

.container {
  position: relative;
  height: 480px;
  width: 320px;
  background: white;
 }
 
 .page {
   top: 240px;
   position: absolute;
   width: 100%;
   height: 50%;
 }
 .page > div {
   display: block;
   height: 100%;
   width: 100%;
   position: absolute;
   -webkit-transform-style: preserve-3d;
 }

dabblet.html

<div class="container">
<div class="page">
	<div class="front" style="-webkit-transform: rotateX(10deg)">Seite 1 Front</div>
	<div class="back" style="-webkit-transform: rotateX(-180deg)">Seite 1 Back</div>
</div>
</div>

settings.json

{"view":"split-vertical","fontsize":"90","seethrough":"","prefixfree":"1","page":"all"}