Почему цвета границ инвертируются при применении фонового градиента?

Я наткнулся на нечто странное. При применении пунктирной белой рамки к элементу цвета фонового градиента отображаются на неправильной стороне элемента, например:

Я видел это в последних версиях Firefox, Chrome, Opera и в IE10. Однако IE9 имеет ожидаемый эффект.

Мой css в настоящее время:

aside.block { 

    width:                  259px;
    padding:                12px;
    margin:                 15px 0;

    border:                 2px dashed #fff;

    background-image:       -o-linear-gradient(bottom, rgb(219,203,0) 0%, rgb(255,236,0) 100%);
    background-image:       -moz-linear-gradient(bottom, rgb(219,203,0) 0%, rgb(255,236,0) 100%);
    background-image:       -webkit-linear-gradient(bottom, rgb(219,203,0) 0%, rgb(255,236,0) 100%);
    background-image:       -ms-linear-gradient(bottom, rgb(219,203,0) 0%, rgb(255,236,0) 100%);
    background-image:       linear-gradient(bottom, rgb(219,203,0) 0%, rgb(255,236,0) 100%);
    filter:                 progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec00', endColorstr='#dbcb00');

}

Цвета границ слева и справа цветные, но так как это происходит практически в каждом браузере, я должен предположить, что это моя ошибка, а не ошибка браузера. Что мне здесь не хватает?