css - svg圆中心对齐在IE11中不起作用

Question

我正在使用css制作一个圆形进度条。在它里面我有一个svg里面的圆圈。问题是圆圈在IE11中被切断了。请帮助解决这个问题。提前感谢您的帮助

我的代码

.percent {
    position: relative;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    }
    
    svg {
    position: relative;
    width: 130px;
    height: 130px;
    }
    
    svg circle {
    width: 100%;
    height: 100%;
   /* margin-left:auto;
    margin-right:auto;
    display:block;not working*/
    fill: none;
    stroke: #dbdbdc;
    stroke-width: 6;
    -webkit-transform: translate(5px, 5px);
    transform: translate(5px, 5px);
}

<div class="percent">
                                    <svg class="Malware">
                                        <circle cx="60" cy="60" r="60"></circle>
                                        <circle cx="60" cy="60" r="60"></circle>
                                   </svg>
                                    <div class="number">
                                        <h2>91</h2>
                                    </div>
                                </div>

我的问题

所需的输出

标签： csssvg