title: How to resize SVG clip-path?
body: <p>I am using an SVG as a mask for an image and I'm trying to resize it. I tried indicating the width &amp; height (to 100) but it still doesn't scale. Just remains the same size.</p>
  
  <p><a href="http://codepen.io/anon/pen/eJOXNZ" rel="noreferrer">Codepen Demo</a> </p>
  
  <p>This is the SVG code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;svg height="100" width="100"&gt;
    &lt;defs&gt;
      &lt;clipPath id="svgPath"&gt;
        &lt;path fill="#EDEBEA" d="M468.855,234.292H244.117V9.439L468.855,234.292z" /&gt;
        &lt;path fill="#EDEBEA" d="M6.864,8.939h224.73v224.733L6.864,8.939z" /&gt;
        &lt;path fill="#EDEBEA" d="M244.118,469.73V245.005h224.737L244.118,469.73z" /&gt;
        &lt;path fill="#EDEBEA" d="M231.594,245.005V469.73H6.863L231.594,245.005z" /&gt;
      &lt;/clipPath&gt;
    &lt;/defs&gt;
  &lt;/svg&gt;</code></pre>
  </div>
  </div>
  </p>