Block Behavior - Margins

dabblet.css

/**
 * Block Behavior - Margins
 */

body {
	margin: 0 auto;
	width: 80%;
	background-color: #222;
}
.container {
	margin-top: 2em;
	background-color: #f0f0f0;
}
.box {
	width: 30%;
	padding-top: 20%;
}
.box-1 {
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	background-color: rgba(255, 0, 255, .8);
}
.box-2 {
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	background-color: rgba(255, 255, 0, .8);
}
.box-3 {
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: auto;
	background-color: rgba(0, 191, 255, .8);
}

dabblet.html

<div class="container">
	<div class="box box-1"></div>
	<div class="box box-2"></div>
	<div class="box box-3"></div>
</div>

dabblet.js

// alert('Hello world!');

settings.json

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