У меня есть две панели со свойствами граничного радиуса. Обе панели имеют элементы внутри с собственными фоновыми цветами и границами. Обе панели прокручиваются. В случае с первой панелью, когда прокручивается div, цвета фона и границы принимают радиус границы контейнера в качестве края, тогда как на второй панели границы и цвета фона внутренних элементов перекрывают углы своими прямыми краями. Почему?
Поведение панели ::
#coursepack .corecol .extention .dirpanel {
background-color:#222;
border-top-left-radius:10px;
border-top-right-radius:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
height:322px;
width:304px;
border:1px solid #AAA;
overflow:hidden;
}
Панель плохого поведения ::
#coursepanel .opsextention {
position:absolute;
width:320px;
height:410px;
border-top-right-radius:10px;
border-bottom-right-radius:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomright:10px;
z-index:2;
opacity:0.80;
left:358px;
top:20px;
background-color:#222;
-webkit-box-shadow: 0px 0px 10px #FFF;
-moz-box-shadow: 0px 0px 10px #FFF;
box-shadow: 0px 0px 10px #FFF;
overflow:hidden;
}
Решить скрипку http://jsfiddle.net/3V8T8/5/ заметить границы, пронизывающие углы
Вот скрипка, показывающая оба. Второй показывает рабочие закругленные углы, но я не вижу, в чем разница http://jsfiddle.net/3V8T8/10/