Half responsive, half static

dabblet.css

/**
 * Half responsive, half static
 */
html {
  background: #f06;
  background: linear-gradient(45deg, #f06, yellow);
  min-height: 100%;
  font-family: Helvetica,Arial;
}

h1 {
  font-size: 1.4em;
}

#Container {
  width: 940px;
  margin: 0 auto;  
}

#Left {
  float: left;
  width: 620px;
}

#Right {
  float: left;
  width: 300px;
}

@media only screen and (max-width:940px) {
  #Container {
    width: auto;
  }
  #Left {
    width: 62.2340426%;
  }
  #Right {
    width: 31.9148936%;
    min-width: 300px;
  }
}

dabblet.html

<div id="Container">
  <div id="Left">
    <h1>This column needs to be a fluid width</h1>
    <p>Single-origin coffee chillwave umami, quinoa twee cillum put a bird on it flexitarian irure id organic excepteur pinterest tattooed. Truffaut nihil post-ironic, enim tumblr dolore vice nesciunt lomo williamsburg consectetur photo booth. Food truck biodiesel thundercats mixtape terry richardson ethical. Laboris flexitarian direct trade pour-over. Sed dolore PBR, vice thundercats +1 mlkshk tempor ullamco. Polaroid exercitation hoodie enim skateboard. Fanny pack 3 wolf moon DIY, high life proident retro elit.</p>
    <p>Ethnic pour-over whatever deserunt exercitation aliquip. Mollit four loko eiusmod incididunt, commodo hoodie quinoa pariatur organic banksy. Street art nulla art party, locavore nostrud mumblecore mollit polaroid esse wayfarers four loko chillwave whatever pork belly. Non excepteur williamsburg labore. Anim cardigan messenger bag, nesciunt put a bird on it sunt biodiesel wayfarers carles adipisicing. Mlkshk pop-up mcsweeney's, aliquip sint letterpress non gentrify craft beer do. Nihil narwhal est hella gentrify before they sold out, duis eu enim laboris typewriter cosby sweater biodiesel ea.</p>
    <p>Artisan proident sed, yr dolor fugiat american apparel fingerstache 3 wolf moon odd future readymade tumblr post-ironic aliqua freegan. Helvetica lomo blog, cillum single-origin coffee placeat banksy kogi sunt. Messenger bag shoreditch echo park artisan, mollit aute street art vinyl. Pinterest tofu skateboard incididunt, whatever lo-fi jean shorts small batch retro. Tempor pinterest food truck, fanny pack odio incididunt umami. Post-ironic wayfarers non portland delectus hella PBR. Polaroid pinterest post-ironic adipisicing.</p>
    <p></p>
  </div>
  <div id="Right">
    <h1>This column NEEDS to always be at least 300px</h1>
    <p>Single-origin coffee chillwave umami, quinoa twee cillum put a bird on it flexitarian irure id organic excepteur pinterest tattooed. Truffaut nihil post-ironic, enim tumblr dolore vice nesciunt lomo williamsburg consectetur photo booth. Food truck biodiesel thundercats mixtape terry richardson ethical. Laboris flexitarian direct trade pour-over. Sed dolore PBR, vice thundercats +1 mlkshk tempor ullamco. Polaroid exercitation hoodie enim skateboard. Fanny pack 3 wolf moon DIY, high life proident retro elit.</p>
    <img src="http://placekitten.com/300/250">
  </div>
</div>

settings.json

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