vasilisvg/dabblet.css

## dabblet.css
/**
 * The first commented line is your dabblet’s title
 */


figure {
    position: relative;
    display: table; /* geloof ik, niet getest */
    width: 1em; /* geloof ik */
}
figure img {
    display: block;
}
figcaption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: hsla(0,0%,100%,.5);
}

## dabblet.html
<!-- content to be placed inside <body>…</body> -->

<figure>
    <img src="http://vasilis.nl/voto/fotos/klein/140513113639-een-minuut-te-laat-500.jpg" alt="">
    <figcaption>Dit moet over dat plaatje heen staan en het maakt helemaal niet uit hoe lang en hoog die tekst is</figcaption>
</figure>

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

## settings.json
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
	/**
	* The first commented line is your dabblet’s title
	*/


	figure {
	position: relative;
	display: table; /* geloof ik, niet getest */
	width: 1em; /* geloof ik */
	}
	figure img {
	display: block;
	}
	figcaption {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: hsla(0,0%,100%,.5);
	}
	<!-- content to be placed inside <body>…</body> -->

	<figure>
	<img src="http://vasilis.nl/voto/fotos/klein/140513113639-een-minuut-te-laat-500.jpg" alt="">
	<figcaption>Dit moet over dat plaatje heen staan en het maakt helemaal niet uit hoe lang en hoog die tekst is</figcaption>
	</figure>