No flexbox here

dabblet.css

/* No flexbox here */

.wrapper {
	background: linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.4));
	overflow: hidden;
	margin: 0 0 1em;
	border-radius: 1em;
}

.pane {
	background: linear-gradient(rgba(255,255,255,0.5),rgba(255,255,255,0.9));
	padding: 0.5em;
}

.pane_center {
	overflow: hidden;
	margin: 0.25em 0;	
}

.pane__content {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-align: center;
}

.pane_left {
	float: left;
	margin: 0.25em;	
	border-radius: 0.75em 0 0 0.75em;
}

.pane_right {
	float: right;
	margin: 0.25em;	
	border-radius: 0 0.75em 0.75em 0;
}

dabblet.html

<h1>No flexbox here</h1>
<div class="wrapper">
	<div class="pane pane_left">something on the left</div>
	<div class="pane pane_right">and on the right</div>
	<div class="pane pane_center">
		<div class="pane__content">
			blah blahblah blahblah blahblah blahblah blahblah blahblah blahblah blahblah blahblah blahblah blahblah blahblah blahblah blahblah blah
		</div>
	</div>
</div>

<div class="wrapper">
	<div class="pane pane_left">something</div>
	<div class="pane pane_right">the right</div>
	<div class="pane pane_center">
		<div class="pane__content">
			blah blahblah blah blahblah blah blahblah


		</div>
	</div>
</div>

<div class="wrapper">
	<div class="pane pane_left">somethinggg</div>
	<div class="pane pane_right">the right lalala</div>
	<div class="pane pane_center">
		<div class="pane__content">
			blah blahblah
		</div>
	</div>
</div>

settings.json

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