A fun exercise brought to you by HTeuMeuLeu. The Alpha Variation

dabblet.css

/**
* A fun exercise brought to you by HTeuMeuLeu. The Alpha Variation
* http://www.hteumeuleu.fr
* http://www.hteumeuleu.fr/a-css-brain-teaser/
* http://www.twitter.com/HTeuMeuLeu
*/

body { padding:50px; background:#2fa7ca; }

header {
	position: relative;
}

h1 {
	font:bold 36px sans-serif;
	letter-spacing:-1px;
	line-height: 1.4em;
	display: inline;
	
	color: #ffffff;
	
	background-color: #ffffff;
	box-shadow: -20px 0px 0px 10px #ffffff, 20px 0px 0px 10px #ffffff;
	opacity: 0.5;
	text-shadow: 0 0 0 rgba(0,0,0,1);
}

h1:after {
	content: attr(data-content);
	
	font: bold 36px sans-serif;
	letter-spacing: -1px;
	line-height: 1.4em;
	display: inline;
	
	color: #000000;
	
	position: absolute;
	top: 0;
	left: 0;
	
	background-color: transparent;
	box-shadow: -20px 0px 0px 10px transparent, 20px 0px 0px 10px transparent;
	
	text-shadow: 0 0 0 rgba(0,0,0,1010p

dabblet.html

<header data-p="antani">
        <h1 data-content="Some dynamic HTML text on several lines with a background that suits well and some margins around it.">
Some dynamic HTML text on several lines with a background that suits well and some margins around it.
</h1>
</header>

settings.json

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