Почему для телефона и gogle chrom'а стили работают правильно, а для opera нет? И как это исправить?

Question

[DmSS1997]

У меня есть селект с выбором города, в котором надо было убрать рамку и подсвечивание при выборе
Вот html код:

<div class="place">
      <select id="myselect" class="selectCity" style="width: 120px;">
           <option class="firstChoise" value="1"> Казань</option>
           <option class="secondChoise" value="2"> Москва</option>
      </select>
</div>

Вот css код:

.place select{
			background: transparent;
			height: 35px;
			padding: 5px 15px 5px 5px;
			color: #D1BBB2;
			border: 1px solid transparent;
			border-image: linear-gradient(180deg, #212529 0%, #453D3E 100%);
			outline:none;
		}
.place select option{
			background-color: white ;
			color: black;
		}

Когда смотришь с браузера гугл хром или с телефона всё круто, всё работает как надо:


но если использовать браузер опера, то стили не работают, так как нужно:




В чём причина и как это можно исправить, подскажите пожалуйста

Comments

[andand44]

appearance может помочь
https://css-tricks.com/almanac/properties/a/appearance/

[DmSS1997]

andand44, Не совсем понимаю как. Если поставить значение none, то тогда да рамка пропадает, но вместе с ней пропадает и стрелочка, которая мне нужна. На другие значения никакой реакции не происходит

[andand44]

Стрелка добавляется стилями. Через background-image, например. Примерно так
https://jsfiddle.net/cyvf7nwh/

[DmSS1997]

andand44, Спасибо огромное!

Answer 1

[Searcher8]

Вопрос кросс-брайзерности. Многие элементы на разных браузерах отражаются по-разному из-за встроенных стилей самого браузера.
Это обычно правиться разными способами, один из них аутопреффиксы.
Есть вариант использования других тегов, например ul со стилизацией его под задуманные стили и подключение js.
Другой вариант, это стилизация через псевдоэлементы, как например, часто делают с input.
Поскольку мне не известны изначальные требований технического задания по которому вы верстаете, могу лишь дать эти несколько вариантов решений. Они достаточно распространены, поэтому можно найти достаточно примеров с кодом в сети.