Cacher is the code snippet organizer for pro developers

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

// alert('Hello world!');

<button>+</button>

/**
 * Extending the hit area — with generated content
 */

button {
	position: relative;
	padding: .3em .5em;
	background: #58a;
	border-radius: 50%;
	border: 1px solid rgba(0,0,0,.3);
	box-shadow:  0 .1em .2em -.05em rgba(0,0,0,.5);
	color: white;
	font: bold 150%/1 sans-serif;
	cursor: pointer;
}

button:before {
	content: '';
	position: absolute;
	top: -10px; right: -10px;
	bottom: -10px; left: -10px;
	box-shadow: 0 0 0 1px rgba(0,0,0,.3) inset,
            0 .1em .2em -.05em rgba(0,0,0,.5);
}