CSS grid with 3 boxes

dabblet.css

/**
 * CSS grid with 3 boxes
 */

body {
	background-color: #ccc;
}

.boxes {
	display: table; /* clearing der Boxen aufheben / bei der Nutzung des Clearfix (s.u.) nicht notwendig */
	width: 900px;
	margin: 0 auto;
	background-color: #fff;
}

.box {
	float: left;
	width: 300px;
}

.box.right {
	float: right;
	margin-left: -5px; /* IE bugfix */
}

.box-inner {
	padding: 10px;
	border: 1px solid black;
	border-left-width: 0px; /* linken Rahmen entfernen */
}

.box:first-child .box-inner {
	border-left-width: 1px; /* linken Rahmen nur in der ersten Box wieder hinzufügen */
}

/* clearfix for older browsers */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

dabblet.html

<div class="boxes clearfix">
	<div class="box left">
		<div class="box-inner">
			<h3>Links</h3>
		</div>
	</div>
	<div class="box middle">
		<div class="box-inner">
			<h3>Mitte</h3>
		</div>
	</div>
	<div class="box right">
		<div class="box-inner">
			<h3>Rechts</h3>
		</div>
	</div>
</div>

settings.json

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