Изменение браузера влияет на ширину класса ⇐ CSS

[Anonymous]

У меня есть функциональная панель поиска, которая работает в Firefox. Я пытался запустить это в Microsoft Edge, однако это сломало панель поиска.
В Firefox она встроена в браузер:
изображение
На краю он слишком расширяется при поиске:
изображение
Я пытался изменить ширину, максимальную ширину, отступы и изменил ширину на 100%, ост. Однако ничего из этого не сработало.

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

#potentialSearchResults {
display: none;
top: 0px;
font-family: Roboto !important;
width: 255px !important;
font-size: 20px;
position: relative;
background-color: var(--background-colour);
border-bottom: solid var(--main-colour);
border-left: solid var(--main-colour);
border-right: solid var(--main-colour);}

#searchBarForm {
overflow: visible !important;
/* overflow: hidden; */
z-index: 100;
/* height: 47px; */
}

как css, так и html

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

[i]
[/i]




 Date 
 Event 

Я не знаю, какое возможное решение, заранее спасибо.

Подробнее здесь: https://stackoverflow.com/questions/793 ... of-a-class