如何根据div大小隐藏SVG边缘

Question

我有这个div：

使用时钟SVG - 我需要＆＃34;掩盖＆＃34;它在div上。

我怎么能用CSS做到这一点？ - 这是我用来在html

中创建SVG的代码

CSS :(影响svg和div＆＃39;）

.aligner {
    margin-top: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.clock {
        color: #fff;
        background-repeat: no-repeat;
        left: -114px;
        top: 112px;
        width: 67%;
        height: 68%;
        position: absolute;
       } 

HTML code + SVG（HTML文件包含SVG数据）：

<div class="col-md-4 col-sm-4 col-xl-4" style="background-color:#808daa;height:inherit;margin-left:30px">
        <div id="divSLAPie">
            <div>
                <svg version="1.1" class="clock" id="svg_clock" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 173.8 173.8" style="enable-background:new 0 0 173.8 173.8;" xml:space="preserve">

<g>
                    <path d="M87,172.6c-2.3,0-4.2-1.9-4.2-4.2c0-2.3,1.9-4.2,4.2-4.2c42.6,0,77.3-34.7,77.3-77.3S129.6,9.6,87,9.6S9.6,44.3,9.6,86.9
        c0,17.6,5.8,34.3,16.7,48.1C37,148.4,52,158,68.4,162c2.2,0.6,3.6,2.8,3.1,5.1c-0.6,2.2-2.8,3.6-5.1,3.1
        c-18.3-4.5-34.8-15.1-46.6-30C7.7,124.9,1.3,106.5,1.3,86.9C1.3,39.7,39.7,1.2,87,1.2c47.3,0,85.7,38.4,85.7,85.7
        S134.2,172.6,87,172.6z" />
                    <path d="M102.4,91.1H87c-2.3,0-4.2-1.9-4.2-4.2V46.5c0-2.3,1.9-4.2,4.2-4.2c2.3,0,4.2,1.9,4.2,4.2v36.3h11.2c2.3,0,4.2,1.9,4.2,4.2
        C106.6,89.2,104.7,91.1,102.4,91.1z" />
                    <path d="M87,27.5c-2.3,0-4.2-1.9-4.2-4.2v-4.2c0-2.3,1.9-4.2,4.2-4.2c2.3,0,4.2,1.9,4.2,4.2v4.2C91.2,25.7,89.3,27.5,87,27.5z" />
                    <path d="M87,158.9c-2.3,0-4.2-1.9-4.2-4.2v-4.2c0-2.3,1.9-4.2,4.2-4.2c2.3,0,4.2,1.9,4.2,4.2v4.2C91.2,157.1,89.3,158.9,87,158.9z" />
                    <path d="M155.5,91.1h-4.9c-2.3,0-4.2-1.9-4.2-4.2c0-2.3,1.9-4.2,4.2-4.2h4.9c2.3,0,4.2,1.9,4.2,4.2
        C159.6,89.2,157.8,91.1,155.5,91.1z" />
                    <path d="M23.4,91.1h-4.9c-2.3,0-4.2-1.9-4.2-4.2c0-2.3,1.9-4.2,4.2-4.2h4.9c2.3,0,4.2,1.9,4.2,4.2C27.6,89.2,25.7,91.1,23.4,91.1z" />


</g>

</svg>
            </div>
            <div class="col-md-4">
                <h6>SLA (2 Weeks)</h6>
                <span style="font-size:medium"><span id="spnSLAMonthAvg"></span> avg.</span>
            </div>
            <div class="col-md-8 aligner">
                <div id="divSLAPieAvg" class="pie"></div>
            </div>
        </div>
    </div>

这是添加overflow:hidden后更新的css（.clock）：

.clock {
    color: #fff;
    background-repeat: no-repeat;
    left: -114px;
    top: 112px;
    width: 67%;
    height: 68%;
    overflow:hidden;
    position: absolute;
}