Html “消除多余的”；“尾巴”；从包含图像的svg

我有一个png标志，我把它围成一个圆圈。 当使图像足够大时，我看到有很多多余的空白

我是svg新手，我尝试了各种方法来调整svg的大小，但这会降低图像质量或大小。我曾尝试将svg放入div容器并调整div的大小，但没有成功。所附图像为940 x 940px

<div class="container" style="height:10%;width:100%; display:block;">
    <svg id="graph" class="text-center" width="100%" height="3500px" display="block">

        <defs>
            <pattern id="image" x="0%" y="0%" height="100%" width="100%"
                     viewBox="0 0 350 420">
                <a href="index.html">
                    <image x="0%" y="0%" width="512" height="512" xlink:href="img/CheesyTools2.png"></image>
                </a>
            </pattern>
        </defs>

        <circle id="sd" class="medium" cx="50%" cy="5%" r="5%" fill="url(#image)" stroke="black" stroke-width="0.5%" />
        <text text-anchor="middle" x="50%" y="11%" style="color:#274666; font-size:40px;">CheesyTools</text>
        <text text-anchor="middle" x="50%" y="12%" style="color:#274666; font-size:20px;">The world's leading website in being useless.</text>

    </svg>
</div>

奶酪工具
世界领先的无用网站。

显示徽标的图像：

我知道多余的空白来自3500px的高度，但这是唯一的方法，我可以得到一个合适的大小为网站的标志。 我希望它的尺寸相同，但没有多余的高度

---

说真的，一个傻瓜。

我在您的SVG中做了很多更改。我使用的不是SVG的宽度和高度，而是

viewBox

属性。SVG没有以前那么大，它只是图像和文本所需的大小。现在更容易使用SVG并将其放在页面中需要的任何位置。我希望有帮助

svg{
边框：1px实心；
宽度：365px；
高度：380px；
保证金：自动；
位置：绝对位置；
排名：0；
底部：0；
左：0；
右：0；
}

奶酪工具
世界领先的无用网站。

（仅供参考，首先，这不一定需要SVG-使用

边框半径格式化图像本身可以达到相同的效果…）这就像一个魅力，稍微调整了css，非常完美！非常感谢你，enxaneta！