YAML 3col layout with fixed sidebars (left and right)

dabblet.css

/**
 * YAML 3col layout with fixed sidebars (left and right)
 * col1 | col2 | col3
 */

body {
 background: #efefef;
}

.ym-wrapper {
  max-width: 90em;
  min-width: 600px;
  margin: 0 auto;
  background: #fff;
}
.ym-wbox { padding: 10px; }

.ym-column {
  display: block;
  overflow: hidden;
  padding: 0 240px 0 240px; /* column width */
  width: auto;
}

.ym-col1 {
  position: relative;
  float: left;
  width: 240px;
  margin: 0 0 0 -240px;

  background: rgba(255,0,0,0.3);
}

.ym-col2 {
  float: left;
  width: 100%;;
  margin: 0;
  
  background: rgba(0,255,0,0.3);
}

.ym-col3 {
  position: relative;
  float: left;
  width: 240px;
  margin: 0 -240px 0 0;
  
  background: rgba(0,0,255,0.3);
}

.ym-cbox { padding: 0 10px; }

dabblet.html

<div class="ym-wrapper">
  <div class="ym-wbox">
  
    <div class="ym-column">
      <div class="ym-col1">
        <div class="ym-cbox">
          <h1>Col 1</h1>
        </div>
      </div>
      <div class="ym-col2">
        <div class="ym-cbox">
          <h1>Col 2</h1>
        </div>
      </div>
      <div class="ym-col3">
        <div class="ym-cbox">
          <h1>Col 3</h1>
        </div>
      </div>
    </div>
  
  </div>
</div>

settings.json

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