컨테이너 내에 SVG를 센터링하는 방법은 무엇입니까?

Question

이 SVG를 가로로 중심에 두는 방법은 .svg_wrapper입니까?

http://jsfiddle.net/frank_o/fj7Xc/

HTML :

<div class="svg_wrapper"> 
    <svg viewBox="0 0 600 425"> 
     <path d="M 175, 175 m 0, -75 a 75,75 0 1,0 0,150 a 75,75 0 1,0 0,-150" fill="none" stroke="black" stroke-width="150" stroke-dasharray="0 600 600 0" stroke-dashoffset="1000"> 
      <animate attributeType="XML" attributeName="stroke-dashoffset" from="0" to="600" dur="2s" repeatCount="1" fill="freeze" /> 
     </path> 
    </svg> 
</div> 

CSS :

.svg_wrapper { 
    border: 1px solid grey; 
    width: 200px; 
} 

시도 물건 text-align: center뿐만 아니라 인 flexbox, margin: 0 auto 좋아하지만 아무 소용.

Answer 1

SVG 래퍼의 중심에 ... 경로는, 그러나, SVG

중심으로하지 않습니다 당신은 viewbox 따라

<svg viewBox="0 0 350 350"> 

JSfiddle Demo