CSS3 background-clip не работает для прозрачных границ

Question

Я следую за transparent border tutorial в CSS-Tricks. Однако мой код не делает границу прозрачной. Мой код (на мои глаза) выглядит правильно.

Пожалуйста see this fiddle

#popup { 
    position: fixed; 
    top: 20px; 
    right: 20px; 
    width: 300px; 
    border: 20px solid rgba(0,0,0,0.3); 
    border-radius: 20px; 

    -moz-background-clip: padding; 
    -webkit-background-clip: padding; 
    background-clip: padding-box;  

    padding: 10px; 
    margin: 20px; 
    background: white; 
}​ 

Вы можете увидеть на CSS-уловке example page, что они не требуют каких-либо двойных завернутых фокусов Дивых. Они просто устанавливают фон div на белый, граница прозрачна и задает область клипа заполнения.

Answer 1

Своп порядок background и border-color см: [? Почему я не могу использовать фон-клип]

http://jsfiddle.net/efortis/26795/4/