True Grid

dabblet.css

/**
 * True Grid
 */

/* -------------------------------- *\
	$TRUE_GRID $TBG
\* -------------------------------- */
.row-true-grid { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } 
.row-true-grid:before, 
.row-true-grid:after { display: table; line-height: 0; content: ""; } /* Clearfix */
.row-true-grid [class*="bs-one"] { display: block; float: left; width: 100%; min-height: 30px; /*margin-left: 2.564102564102564%;*/ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.row-true-grid .bs-one-fifth  { width:  20%;   }
.row-true-grid .bs-one-fourth { width:  25%;   }
.row-true-grid .bs-one-third  { width:  33.3%; }	
.row-true-grid .bs-one-half   { width:  50%;   }
.row-true-grid .bs-one-whole  { width: 100%;   }

.test { background-color: lightgrey; border-radius:7px; }
.test-cnt { background-color: orange; }

dabblet.html

<div class="test-cnt">
	<div class="row-true-grid">
		<div class="bs-one-third test"></div>
	</div>
</div>

dabblet.js

// alert('Hello world!');

settings.json

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