title: How to color path elements in SVG?
body: <p>A couple of days ago I received an SVG from some designers, and I am to implement it with some color alterations and the typical hover effects and such, <em>/edit:</em> but the main thing for now is to just be able to control the background color <em>/edit/</em>. </p>
  
  <p>The HTML looks like this:</p>
  
  <pre><code>&lt;div&gt;
    &lt;svg class="drawelements" viewBox="50 200 550 360"&gt;
      &lt;polygon fill="red" points="312.200 265.600, 312.200 332.300, 265.600 332.300, 265.600 265.600, 312.200 265.600, 312.700 265.100, 265.100 265.100, 265.100 332.800, 312.700 332.800, 312.700 265.100, 312.700 265.100"&gt;&lt;/polygon&gt;
      &lt;path class="st0" d="M369 265.6v66.7h-46.6v-66.7H369M369.5 265.1h-47.6v67.7h47.6V265.1L369.5 265.1z"&gt;&lt;/path&gt;
      &lt;path class="st0" d="M425.7 265.6v66.7h-46.6v-66.7H425.7M426.2 265.1h-47.6v67.7h47.6V265.1L426.2 265.1z"&gt;&lt;/path&gt;
      &lt;path class="st0" d="M480.6 265.6v66.7H434v-66.7H480.6M481.1 265.1h-47.6v67.7h47.6V265.1L481.1 265.1z"&gt;&lt;/path&gt;
      &lt;path class="st0" d="M537.3 265.6v66.7h-46.6v-66.7H537.3M537.8 265.1h-47.6v67.7h47.6V265.1L537.8 265.1z"&gt;&lt;/path&gt;
      &lt;path class="st0" d="M255.5 265.6v66.7H209v-66.7H255.5M256 265.1h-47.6v67.7H256V265.1L256 265.1z"&gt;&lt;/path&gt;
      &lt;path class="st0" d="M537.3 207.3v49.4H209v-49.4H537.3M537.8 206.8H208.5v50.4h329.3V206.8L537.8 206.8z"&gt;&lt;/path&gt;
    &lt;/svg&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is a fiddle of how it looks: <a href="http://codepen.io/djdifee/pen/BQyqzv" rel="nofollow noreferrer">fiddle</a></p>
  
  <p>I wanted to test with a polygon at the top, just to make sure that it was not the path element that was working against me. </p>
  
  <p>Regular styling with CSS doesn't work, and hard coded styling within each element does not work. Is it because I need to use something else than <em>background-color</em> or <em>fill</em>? </p>
  
  <p>If you look at the fiddle, please don't mind the viewBox. The actual svg contains many more elements which I removed for this post. </p>