verse lines

dabblet.css

/**
 * verse lines
 * use of l elements is a willful violation of the HTML specification
 */

html
{
	font: 1.5em/1.5 Georgia, serif;
}

p, footer
{
	margin: 2em;
	max-width: 9em;
}

l
{
	position: relative;
	display: block;
	padding-left: 2em;
	text-indent: -2em;
	padding-right: 1.5em;
}

l::after
{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 1.5em; /* line height */
	width: 1em;
	overflow-y: hidden;
	content: "↩↩↩↩↩↩"; /* as many characters as you would need */
	word-wrap: break-word;
	text-align: right;
}

cite
{
	font-size: 0.75em
}

dabblet.html

<p>
	<l>I don’t want to change the world</l>
	<l>I’m not looking for a new England</l>
	<l>I’m just looking for another girl</l>
</p>
<footer><cite>Billy Bragg, New England</cite></footer>

dabblet.js

// alert('Hello world!');

settings.json

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