我遇到了一个奇怪的错误,我无法找到任何解决方案,或者我目前遇到同样问题的人。当我放置一个带有边框和边框半径的父元素并且隐藏溢出时,则将子元素设置为与父边框颜色相同的颜色,我得到类似1px内部透明边框的颜色。我知道这是一个图形故障,但有没有办法绕过这个?
.outside
+border-radius(50%)
width: 500px
height: 500px
border: 5px solid #696969
overflow: hidden
.inside
width: 600px
height: 300px
margin-top: 300px
background: #696969
<div class="outside">
<div class="inside"></div>
</div>
http://codepen.io/ricnunes/pen/wBqvzJ
编辑:将SASS更改为CSS,因此更容易看到
.outside {
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
width: 500px;
height: 500px;
border: 5px solid #696969;
overflow: hidden;
margin: 20px;
.outside .inside {
width: 600px;
height: 250px;
margin-top: 400px;
background: #696969;
}