CSS Liquid Layout (Fluid-Fixed-Fixed)

dabblet.css

/**
 * CSS Liquid Layout (Fluid-Fixed-Fixed)
 */
html {
background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%; }

body { padding-top: 85px; } 
#wrapper { margin: 0 auto; max-width: 1100px; min-width: 650px; background: #fff; }

#contentwrapper{float: left; width: 100%; margin-left: -220px; }

#contentcolumn { margin: 0 190px 0 220px; }
#leftcolumn { float: left; width: 220px; margin-left: -220px; background: #C8FC98;}
#rightcolumn { float: left; width: 220px; background: #FDE95E;}
#footer { clear: left; width: 100%; background: black;color: #FFF;text-align: center;padding: 4px 0;}
#footer a { color: #FFFF80;}

.innertube {margin: 10px; margin-top: 0; }

dabblet.html

<div id="wrapper">
<div id="contentwrapper">
  <div id="contentcolumn">
    <div class="innertube">
    <b>Content Column: <em>Fluid</em></b>
    </div>
  </div>
</div>

<div id="leftcolumn">
  <div class="innertube">
    <b>Left Column: <em>220px</em></b>
  </div>
</div>

<div id="rightcolumn">
  <div class="innertube">
    <b>Right Column: <em>220px</em></b>
  </div>
</div>

<div id="footer">
<a href="http://www.google.com/">Googies</a>
</div>
</div>

dabblet.js

// alert('Hello world!');

settings.json

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