Как использовать border-image, чтобы установить цветовой градиент для элемента и при этом задать ему радиус границы? [ду ⇐ CSS

[Anonymous]

Я хочу создать стиль для элемента div, но я хочу, чтобы у него была граница, и я хочу, чтобы граница имела два цвета, идущие сверху слева направо вниз. Я попробовал использовать border-image, это сработало, но border-radius не будет работать, пока я не удалю border-image. Я хотел знать, могу ли я добиться этого любым другим методом. Если вы посмотрите на изображение, то увидите, что оно имеет пунктирную рамку двух разных цветов, и я буду очень признателен, если кто-нибудь поможет мне, как этого добиться.

Код: Выделить всё

.circle-border {
width: 200px;
height: 200px;
border: 10px solid;
border-radius: 50%;
border-image: linear-gradient(to right, #C74AD6, #A5502F) 1;
}

Код: Выделить всё

Это код, который я написал.

Подробнее здесь: https://stackoverflow.com/questions/790 ... d-still-gi