Make Paper Effect used CSS3

Di mana ada tutorial, di sana langkah gue tertuju :d Apalagi bila konten yang ada berbicara seputaran tutorial blogger b-) Bisa anteung baca-baca and korek-korek apa ada yg unik untuk di share ;) Teman kita @blogsdaddy selaku owner dari Blogs Daddy mempunyai artikel seputaran all about the blogger :) Sok dikunjungin biar nambah² perbendaharaan ilmu blog.
Melihat punya perhatian Koben tertarik melihat dengan tampilan GetIn Touch facebook page like box yg ada disana! Basicly efek seperti itu bisa kita buat dengan memakai variabel CSS3 Pseudo-Elements. Lihat ke sini untuk melihat kreasi @tkenny mengenai hal Create the Stacked Elements with CSS3 Pseudo-Elements Keren kan :-/ Kembali pada kepunyaan daddy ternyata mempunyai trik berbeda dalam menampilkan efek tersebut.

DEMO

Konten bisa di isi sesuai dengan keperluan, kalau memang mau diisikan frame like-box facebook, silahkan buat dulu framenya Social Plugins Facebook Ini bumbunya
Kode CSS

.likebox {
width: 292px;
height: 175px;
padding: 0;
margin:0 auto;
position: relative;
background: #f4f4f4
}
.likebox, .likebox:before, .likebox:after {
border:1px solid #ccc;
background: #f4f4f4
}
.likebox:before, .likebox:after {
content:"";
position: absolute;
height: 1px;
bottom: -3px;
left: 2px;
right: 2px;
}
.likebox:after {
left: 4px;
right: 4px;
bottom: -5px;
box-shadow: 0 0 2px #ccc
}

Markup HTML<div class="likebox">

----------- ADD YOUR CONTENT HERE -----------

</div>Tinggal diatur-atur saja lebar & tinggi sesuai kebutuhan.
Apakah hanya itu kode yg bisa kita pakai dalam menampilkan efek bertingkat seperti kertas? Ada lagi dong bos...

Come from by master Kougi Tambo with article css3 Paper Pile effect Memakai variable box-shadow ternyata dapat menghasilkan efek serupa!
Demo

A4

Coded

#paper-pile {
border: 1px solid silver;
overflow: hidden;
background: #fff;
width: 150px;
height: 190px;
-khtml-box-shadow: 0px 5px 0px -4px white, 0px 5px 0px -3px #CCC, 0px 11px 0px -8px white, 0px 11px 0px -7px #CCC,0px 22px 0px -7px rgba(200,200,200,0.1);
-webkit-box-shadow: 0px 5px 0px -4px white, 0px 5px 0px -3px #CCC, 0px 11px 0px -8px white, 0px 11px 0px -7px #CCC,0px 22px 0px -7px rgba(200,200,200,0.1);
-moz-box-shadow: 0px 5px 0px -4px white, 0px 5px 0px -3px #CCC, 0px 11px 0px -8px white, 0px 11px 0px -7px #CCC,0px 22px 0px -7px rgba(200,200,200,0.1);
-ms-box-shadow: 0px 5px 0px -4px white, 0px 5px 0px -3px #CCC, 0px 11px 0px -8px white, 0px 11px 0px -7px #CCC,0px 22px 0px -7px rgba(200,200,200,0.1);
-o-box-shadow: 0px 5px 0px -4px white, 0px 5px 0px -3px #CCC, 0px 11px 0px -8px white, 0px 11px 0px -7px #CCC,0px 22px 0px -7px rgba(200,200,200,0.1); 
box-shadow: 0px 5px 0px -4px white, 0px 5px 0px -3px #CCC, 0px 11px 0px -8px white, 0px 11px 0px -7px #CCC,0px 22px 0px -7px rgba(200,200,200,0.1);
}

Hehehe :P
Bonus: http://redactorjs.com/
Happy coding \m/