Почему не получается сделать круг?

Question

[Роман Тузов]

В данный момент получается квадрат, а я хочу сделать круг. Вот код круга:

.btn-a {
	padding: 30px;
	border: 8px solid transparent;
	border-image: linear-gradient(to left, #171617 , #373838);
	border-radius: 50%;
	text-align: center;
	border-image-slice: 1;
	margin: 0 auto;
}

И вот что получается:

И можете, пожалуйста заодно подсказать как сделать поле select пустым, пока что нибудь не выберут. Спасибо!

Comments

[Мария Коробкоголовых]

Вы бы хоть погуглили, вот на стаковерфлоу подобный вопрос

вот демо

[Роман Тузов]

Мария Коробкоголовых, Спасибо, не пробовал искать на английском. Хотелось бы узнать как вы нашли ответ, не подскажете?

[Ankhena]

border-radius не работает с border-image
Чтобы получить скругленную границу градиентом, нужно подложить вниз псевдоэлемент с фоном градиентом чуть бОльшего, чем элемент и перекрыть его фоном элемента.
Визуально получится граница.

Answer 1

[Ankhena]

border-radius не работает с border-image
Чтобы получить скругленную границу градиентом, нужно подложить вниз псевдоэлемент с фоном градиентом чуть бОльшего, чем элемент и перекрыть его фоном элемента.
Визуально получится граница.


В круг сами превратите

Answer 2

[apoca1ipsis]

не видно тег с классом ".btn-a", но возможно нужно добавить

display: inline-block