边界半径和溢出：隐藏（离子应用程序）

Question

边界半径和溢出有一些问题：隐藏在离子应用程序中。 我得到了父母.dtc-zero-eye和.dtc-zero-iris孩子。

.dtc-zero-eye { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    top: 8.5vh; 
    position: relative; 
    z-index: 9; 
    border: 8px solid #DCDDE1; 
    background-color: #fff; 
    width: 20vh; 
    height: 20vh; 
    border-radius: 5% 125% 5% 125%; 
    -webkit-transform: rotate(-45deg); 
    transform: rotate(-45deg); 
    overflow: hidden; 

    .dtc-zero-iris { 
    width: 12vh; 
    height: 12vh; 
    background-color: #2D9AFF; 
    border-radius: 50%; 
    display: flex; 
    justify-content: center; 
    align-items: center; 

在chrome（调试模式）下尝试时，一切正常。

但是，当尝试在iOS设备上测试草图 - 有这些=>

所以，当我打开边界半径过 - 溢出工作正确的方式。 当然尝试了一些像“掩模图像”的修复，但如预期的那样，它不起作用。

我真的在等待你的答案，对不起我的英语不好。

更新，这里是jsFiddle

Answer 1

也许iOS版采用了边框的外夹的内容？尝试关闭边界，看看会发生什么。