Created
May 24, 2013 19:40
-
-
Save trumball/5645998 to your computer and use it in GitHub Desktop.
Webpage Top Box Shadow
Developers may not find a great use for this other than some pleasing aesthetics. But I really enjoy this effect and it’s definitely something unique! Simply append this CSS code targeting your body element to display a dark drop shadow fading down from the top of your webpage.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body:before { | |
| content: ""; | |
| position: fixed; | |
| top: -10px; | |
| left: 0; | |
| width: 100%; | |
| height: 10px; | |
| -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8); | |
| -moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8); | |
| box-shadow: 0px 0px 10px rgba(0,0,0,.8); | |
| z-index: 100; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment