mac下css實現(xiàn)切角效果，顯示不正常

mac下切角效果，顯示不正常，代碼如下所示，麻煩各位幫忙看看

.corners {
    width: 120px; height: 120px; margin: 40px 30px;
    background: #fb3;
    background: radial-gradient(circle at top left, transparent 15px, #fb3 0) top left,
                radial-gradient(circle at top right, transparent 15px, #fb3 0) top right,
                radial-gradient(circle at bottom right, transparent 15px, #fb3 0) bottom right,
                radial-gradient(circle at bottom left, transparent 15px, #fb3 0) bottom left;
    background-size: 50% 50%;
    background-repeat: no-repeat;
}

<div class="corners"></div>