HTML contenteditable, BR меняет высоту

Question

Tcnm div с такой вот разметкой:

.option__input {
    font-size: 100%;
    border: 0.075em solid black;
    border-radius: 0.3em;
    min-width: 7em;
    max-width: 10em;
    min-height: 1.5em;
    line-height: 1.5em;
    box-sizing: border-box;
    white-space: normal;
    word-break: break-all;
    padding: 0 0.5em;
  outline:none;
}
div{
  display:inline-block;
}

<div>Другое</div>
<div class="option__input text text_input" contenteditable="true"></div>

Когда первый раз вводится текст, добавляется br и немного увеличивает высоту.
Как можно от этого избавиться?

1. Изображение, до ввода текста:
   

2. Изображение, введен пробел:
   

В Chrome все работает, как надо. А вот в Firefox, происходит вышеописанное.