title: SVG - Circle marker not the same size in all browsers (IE11)
body: <p>I tried adding a small circle marker at the end of the <code>&lt;path&gt;</code> element but noticed its size is different in IE11, but Chrome, Firefox, Edge have the "correct" size. Example: <a href="https://codepen.io/anon/pen/PQOVYK" rel="nofollow noreferrer">Codepen</a> (Updated in Edit below)</p>
  
  <pre><code>&lt;svg viewbox="0 0 100 100"&gt;
      &lt;path
        stroke="#ffff00"
        fill-opacity="0"
        marker-start="url(#marker)"
        stroke-width="4"
        d="M 50 98 A 48 48 0 0 0 50 2"
      /&gt;
  
     &lt;marker id="marker" refX="5" refY="5" markerWidth="100" markerHeight="100"&gt;
       &lt;circle class="marker" fill="#ff0000" cx="5" cy="5" r="1.5" /&gt;
     &lt;/marker&gt;
  &lt;/svg&gt;
  </code></pre>
  
  <p>I have also noticed that the fill is not being applied - images show the comparison between Chrome (left) and IE11 (right):</p>
  
  <p><a href="https://i.stack.imgur.com/CcMse.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CcMse.png" alt="Code rendered in Chrome"></a>
  <a href="https://i.stack.imgur.com/swWSa.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/swWSa.png" alt="Code rendered in IE11"></a></p>
  
  <p>Anyone knows the reason for this?</p>
  
  <p>EDIT: I have updated the codepen with the <code>stroke</code> and <code>stroke-width</code> attribute as per @vals suggestion: <a href="https://codepen.io/jdomajnko/pen/aqVxza" rel="nofollow noreferrer">Updated Codepen</a></p>
  
  <pre><code>stroke="#ff0000" stroke-width="0"
  </code></pre>