display:table equal height columns ftw

dabblet.css

/**
 * display:table equal height columns ftw
 */
body{
	font:1.3em/1.4 sans-serif;
}

.table{
	display:table;
}
.table--row{
	display:table-row;
}
.table--cell{
	display:table-cell;
	width:33%;
	padding:1em;
}

.bg__green{
	background:#bada55;
	border:1px solid #333;
}

dabblet.html

<div class="table">
	<div class="table--row">
			<div class="table--cell bg__green">
			We are all equal heights, thanks to display:table;
			</div>
			<div class="table--cell bg__green">
			Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
			Nulla vitae elit libero, a pharetra augue.
			Nulla vitae elit libero, a pharetra augue.
			Sed posuere consectetur est at lobortis.
			Maecenas sed diam eget risus varius blandit sit amet non maelit libero, a pharetra augue.			Sed posuere consectetur est at lobortis.
			Maecenas sed diam eget risus varius blandit sit amet non magna.
			</div>
			<div class="table--cell bg__green">
			Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
			Nulla vitae elit libero, a pharetra augue.
			Nulla vitae elit libero, a pharetra augue.
			Sed posuere consectetur est at lobortis.
			Maecenas sed diam eget risus varius blandit sit amet non magna.
			</div>

	</div>
</div>

dabblet.js

// alert('Hello world!');

settings.json

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