title: Can I apply multiple background colors with CSS3?
body: <p>I know how to specify multiple background images using CSS3 and modify how they are displayed using different options.</p>
  
  <p>Currently I have a <code>&lt;div&gt;</code>, which needs to have a different color for about 30% of the width on the left side:</p>
  
  <pre class="lang-css prettyprint-override"><code>div#content {
    background: url("./gray.png") repeat-y, white;
    background-size: 30%;
  }
  </code></pre>
  
  <p>Instead of loading the image which is totally gray, how can I do this specifying the color, and without additional <code>&lt;div&gt;</code>s?</p>