Skip to content

Instantly share code, notes, and snippets.

@mshahin364

mshahin364/dabblet.css

Last active August 29, 2015 14:27
Show Gist options
  • Save mshahin364/9e5f7478c1e92da6527a to your computer and use it in GitHub Desktop.
Save mshahin364/9e5f7478c1e92da6527a to your computer and use it in GitHub Desktop.
Download ZIP
box shadow on three sides, two sides, one side
Raw
dabblet.css
/**
* box shadow on three sides, two sides, one side
*/
/* I think they look more like borders when done like this */
div {
width: 150px;
height: 150px;
margin: 25px;
/**border: solid 5px orange;/**/
float: left;
background: #D2691E;
}
.t1 {
box-shadow: inset 0px -10px 0px 10px #000;
}
.t2 {
box-shadow: inset -10px -10px 0px 10px #000;
}
.t3 {
box-shadow: inset -10px 0px 0px 0px #000;
}
.t4 {
box-shadow: 0px 10px 0px 10px #000;
}
.t5 {
box-shadow: 10px 10px 0px 10px #000;
}
.t6 {
box-shadow: 10px 0px 0px 0px #000;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div class='t1'></div>
<div class='t2'></div>
<div class='t3'></div>
<div class='t4'></div>
<div class='t5'></div>
<div class='t6'></div>
Raw
settings.json
{"view":"split-vertical","fontsize":"80","seethrough":"","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment