Как правильно сделать градиентный border кнопки с анимацией?

Question

[kombat003]

Есть кнопка, нужно сделать градиентный border с двух ее углов, при наведении обводка должна становиться сплошной. Я сделал это таким образом -
Но есть две проблемы (обе видны на гифке) -

1. В хроме анимация дерганая
   
2. Нижняя граница почему-то не всегда отображается
   

Как их можно исправить, либо возможно есть какой-то более правильный способ реализации подобного эффекта?

Answer 1

[Nikita-Fast]

Comments

[kombat003]

Спасибо, но странная вещь, в хроме анимация стала плавнее, но баг с нижней границей не ушел, но в Chrome Canary остались оба бага, при этом в safari, opera, firefox, не было ни одного бага и на моем варианте.
Safari также почему-то не полностью overflow применяет -