Little CSS trick to show basel;ne's before and after pseudo elements

dabblet.css

/*
 * Little CSS trick to show basel;ne's before and after pseudo elements
 * http://b4d455.fr/basel/
*/

@import "http://b4d455.fr/basel/style.css";

.simple:before {
	border-left: solid 1px red;
	margin-right: -1px;
}
.simple:after {
	border-left: solid 1px green;
	margin-right: -1px;
}

dabblet.html

<section class=main>
	<p class=simple>This is a demo paragraph.</p>
</section>

settings.json

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