Chrome bug ContentEditable inline-block: DIV Moves - PullRequest
Новая
       9

Chrome bug ContentEditable inline-block: DIV Moves

0 голосов
/ 11 мая 2019

В Chrome (74.0.3729.131) я создал div с редактируемым содержимым, стилизованным под height, width, display:inline-block и overflow-y:auto. Такое же аномальное поведение происходит при использовании элемента span.

Если в div есть два элемента br, при вводе Enter в div будет перемещаться весь div вниз по странице. Backspace перемещает его вверх.

Inline-block должен содержать br, а не sub-div или p.

Код: 

div.outside {
  margin: 30px;
  border: 1px solid red;
}

div.text-input {
  display: inline-block;
  background-color: lime;
  color: black;
  width: 300px;
  height: 20px;
  overflow-y: auto;
  border: 1px solid black;
}
<div class="outside">
  <div class='text-input' contenteditable="true">
    <br/><br/>
  </div>
</div>

Что, конечно, должно произойти, это ввести несколько разрывов строк в div. Вместо этого все div движется.

У кого-нибудь есть обходной путь?

...