Opera странно смотрит на элементы ввода, если установлен атрибут width - PullRequest
Новая
       22

Opera странно смотрит на элементы ввода, если установлен атрибут width

1 голос
/ 27 марта 2020

У меня очень простой случай:

На странице html есть только поле выбора и кнопка. Они располагаются в одну строку с flexbox, а выбор имеет flex: 1.

. Это работает во всех основных браузерах, но Opera добавляет странное окончание к моему блоку выбора (второй вариант - при наведении поля выбора):

enter image description here

Как мне удалить этот странный конец?

Вот минимальный пример (это воспроизводит мою проблему, если вы просматриваете страница в Опере): 

.holder {
  /*display: flex;*/
}

.list {
  /*flex: 1;*/
  width: 100%;
  margin-bottom: 10px;  
}

.button {
  width: 100%;
}
<div class="holder">
<select class="list">
<option selected disabled hidden>Please select</option>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>
<button class="button">Test</button>
</div>

Версия Opera - 67.0.3575.97, которая, как я считаю, является самой последней или, по крайней мере, весьма устаревшей.

Обновление

Я понял, что это вообще не связано с flexbox.

Если я просто установлю ширину поля выбора, Opera разрушит его. (код обновлен, чтобы предоставить этот более простой пример). Таким образом, это происходит с каждым элементом ввода, даже с кнопкой. Чем шире элемент, тем хуже проблема.

Это связано с -webkit-appearance Opera (я ничего не менял, все осталось по умолчанию).

...