Stacked Papers Using box-shadow

Anas Nakawa

• 12668
• 21
• 0

Stacked papers using only multiple box-shadow for the same element that uses no pseudo elements. Using no pseudo elements the 3 paper limit gets removed and we can now put as many papers in the stack we want. The use of multple box-shadow is such like that the first shadow created the first stacked paper, then the second shadow is used for the shadow of that first stack paper (which is darker in color) and then the third one for second stacked paper and so on.

This method is a bit of hassle but it's definitely better than the :after and :before approach. Take a look at the code to learn more about it.

Related:

• CSS Only Solar System Model
• Minions in pure CSS
• Multiple Box Shadows
• Clicking Game
• CSS3 Room