box-shadow vs filter: drop-shadow 2

dabblet.css

/**
 * box-shadow vs filter: drop-shadow 2
 */

body {
	background: #ddd;
	font: 16px/1 sans-serif;
	margin: 50px;
	}
div {
	display: inline-block;
	margin: 0 50px -2px 10px;
	height: 17px;
	width: 22px;
	background: url(http://f.cl.ly/items/0l0T1Q453z2o2t3n0m24/envelope.png);
	}
	.box-shadow {
		box-shadow: 0 1px 2px rgba(0,0,0,.5);
		}
	.filter-drop-shadow {
		-webkit-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-moz-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-ms-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-o-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		}

dabblet.html

none <div></div>
box-shadow <div class="box-shadow"></div>
filter: drop-shadow <div class="filter-drop-shadow"></div>​

settings.json

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