Space between SVG and path - svg

Question

I am using SVG to clip an image to the shape of SVG.The screenshot I have attached is of chrome(first) and IE(second).In IE it looks very small in size.The issue is I find space between the SVG and path. I have tried out many combinations of viewBox but nothing worked out.I even scaled my SVG to 1*1 even then I am facing this issue.
<div>
<svg class="svg-graphic" width="100%" height="100%" viewBox="35 35 1000 1000" xmlns="http://www.w3.org/2000/svg" >
<g>
<clipPath id="arch-mask" >
<path class="st0" d="M905.33,324.23c0-4.36-3.42-7.48-7.89-7.89c-72.15-3.95-130.16-61.96-134.11-134.11
c-0.18-4.35-3.53-7.89-7.89-7.89H297.89c-4.36,0-7.48,3.42-7.89,7.89c-3.95,72.15-61.96,130.16-134.11,134.11
c-4.35,0.18-7.89,3.53-7.89,7.89v457.55c0,4.36,3.42,7.48,7.89,7.89c72.15,3.95,130.16,61.96,134.11,134.11
c0.18,4.35,3.53,7.89,7.89,7.89h457.55c4.36,0,7.48-3.42,7.89-7.89c3.95-72.15,61.96-130.16,134.11-134.11
</clipPath>
</g>
<image clip-path="url(#arch-mask)" height="100%" width="100%" xlink:href="https://picsum.photos/id/1003/500/500" />
</svg>

Answer 1

You have a few errors in your code like the path that isn't closing. I've changed the viewBox of the svg element so that you have no spaces between the clipping path and the borders of the svg element. Also I've changed the size and the position of the image to be the same as the bounding box of the clipping path. To get the bounding box you can use the getBBox() method.
In javaScript you'll find commented out the bounding box of the path inside the clipping path.
/*let bb = document.querySelector("#arch-mask path").getBBox();
console.log(bb)*/
svg{border:solid}
<svg class="svg-graphic" width="100%" height="100%" viewBox="148 174 757.33 757.33" xmlns="http://www.w3.org/2000/svg" >
<g>
<clipPath id="arch-mask" >
<path class="st0" d="M905.33,324.23c0-4.36-3.42-7.48-7.89-7.89c-72.15-3.95-130.16-61.96-134.11-134.11
c-0.18-4.35-3.53-7.89-7.89-7.89H297.89c-4.36,0-7.48,3.42-7.89,7.89c-3.95,72.15-61.96,130.16-134.11,134.11
c-4.35,0.18-7.89,3.53-7.89,7.89v457.55c0,4.36,3.42,7.48,7.89,7.89c72.15,3.95,130.16,61.96,134.11,134.11
c0.18,4.35,3.53,7.89,7.89,7.89h457.55c4.36,0,7.48-3.42,7.89-7.89c3.95-72.15,61.96-130.16,134.11-134.11"/>
</clipPath>
</g>
<image clip-path="url(#arch-mask)" x="148" y="174" width="757.33" height="757.33" xlink:href="https://picsum.photos/id/1003/500/500" />
</svg>