Skip to content

Instantly share code, notes, and snippets.

@xzyfer

xzyfer/dabblet.css

Created February 22, 2013 03:13
Show Gist options
  • Save xzyfer/5010457 to your computer and use it in GitHub Desktop.
Save xzyfer/5010457 to your computer and use it in GitHub Desktop.
Download ZIP
Untitled
Raw
dabblet.css
#page { border: red 1px solid; padding: 1%; clear: both; }
#page * { box-sizing: border-box; }
.row { width: 100%; clear: both; border: green 1px solid; }
.row div { height: 100px; background-color: blue; margin: 1%; float: left; }
.full { width: 98%; }
.half { width: 48%; }
.third { width: 31.33%; }
.quarter { width: 23%; }
.twelves { width: 6%; }
.cf:before,
.cf:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.cf:after {
clear: both;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div id=page>
<div class="row cf">
<div class="half"></div>
<div class="half"></div>
</div>
<div class="row cf">
<div class="half"></div>
<div class="quarter"></div>
<div class="quarter"></div>
</div>
<div class="row cf">
<div class="third"></div>
<div class="third"></div>
<div class="third"></div>
</div>
<div class="row cf">
<div class="full"></div>
</div>
</div>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment