Hover me

dabblet.css

/**
 * Hover me
 */

blockquote
{
	font: italic 1.25em/1.5 Georgia, serif;
	max-width: 21.5em;
	height: 1.5em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

blockquote:hover
{
	height: auto;
	white-space: normal;
}

blockquote:hover l
{
	display: block;
}

blockquote footer
{
	margin: 1.25em 0;
	font: normal 0.8em "Helvetica Neue", Helvetica, Arial, sans-serif;
}

blockquote footer cite
{
	font-style: normal;
}

dabblet.html

<!-- willful violation of current HTML spec intentional -->
<blockquote>
	<l>The times are tough now, just getting tougher</l>
	<l>This old world is rough, it’s just getting rougher</l>
	<l>Hover me, come on baby, hover me</l>
	<l>Well I’m looking for a lover who will come on in and hover me</l>
	<footer>(with apologies to <cite><a href="http://brucespringsteen.net/songs/cover-me">Bruce Springsteen</a></cite>)</footer>
</blockquote>

dabblet.js

// alert('Hello world!');

settings.json

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