thesifter/dabblet.css

## dabblet.css
body {
    background: #f06;
    background: linear-gradient(90deg, #f06, #ff0);
    min-height: 100%;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-size: 24pt;
}

.wrap {
    position: absolute;
    top: 60px;
    left: 60px;
    right: 60px;
}

.thing {
    padding: 20px;
    background-color: #222;
    opacity: 0.6;
}

.thing + span {
    color: #fff;
    position: absolute;
    top: 25%;
    left: 20px;
}

## dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div class="wrap">
    <div class="thing"> </div>
    <span>This is just a test. This is just a test. This is just a test. This is just a test. This is just a test. This is just a test. This is just a test. </span>
</div>

## dabblet.js
// alert('Hello world!');

## settings.json
{"view":"separate","fontsize":"80","seethrough":"","prefixfree":"1","page":"all"}
	body {
	background: #f06;
	background: linear-gradient(90deg, #f06, #ff0);
	min-height: 100%;
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-size: 24pt;
	}

	.wrap {
	position: absolute;
	top: 60px;
	left: 60px;
	right: 60px;
	}

	.thing {
	padding: 20px;
	background-color: #222;
	opacity: 0.6;
	}

	.thing + span {
	color: #fff;
	position: absolute;
	top: 25%;
	left: 20px;
	}
	<!-- content to be placed inside <body>…</body> -->
	<div class="wrap">
	<div class="thing"> </div>
	<span>This is just a test. This is just a test. This is just a test. This is just a test. This is just a test. This is just a test. This is just a test. </span>
	</div>