iamstarkov/dabblet.css

## dabblet.css
/**
 * http://stackoverflow.com/questions/10561162/how-can-i-vertically-align-two-floated-divs
 */

	#parent {
		position: relative;

		/* decoration */
		width: 500px;
		height: 200px;
		background-color: #ddd;
	}

	.child {
		position: absolute;
		top: 50%;
		height: 70px;
		/* if text is one-line, line-height equal to height set text to the middle */
		line-height: 70px;
		/* margin-top is negative 1/2 of height */
		margin-top: -35px;

		/* decoration */
		width: 200px;
		text-align: center;
		background-color: #dfd;
	}

	#left-box { left: 0; }
	#right-box { right: 0; }

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

	<div id='parent'>
	    <div id='left-box' class='child'>Some text</div>
	    <div id='right-box' class='child'>Details</div>
	</div>

## settings.json
{"view":"separate","fontsize":"100","seethrough":"1","prefixfree":"1","page":"all"}
	/**
	* http://stackoverflow.com/questions/10561162/how-can-i-vertically-align-two-floated-divs
	*/

	#parent {
	position: relative;

	/* decoration */
	width: 500px;
	height: 200px;
	background-color: #ddd;
	}

	.child {
	position: absolute;
	top: 50%;
	height: 70px;
	/* if text is one-line, line-height equal to height set text to the middle */
	line-height: 70px;
	/* margin-top is negative 1/2 of height */
	margin-top: -35px;

	/* decoration */
	width: 200px;
	text-align: center;
	background-color: #dfd;
	}

	#left-box { left: 0; }
	#right-box { right: 0; }
	<!-- content to be placed inside <body>…</body> -->

	<div id='parent'>
	<div id='left-box' class='child'>Some text</div>
	<div id='right-box' class='child'>Details</div>
	</div>