When you open this in Safari on the Desktop (I used 26.1), and start a composition in the empty contenteditable field.

E.g. use the dead key ^ and then press a).

Notice how the original editable-field div gets destroyed (the blue dashed border disappears).

Now, comment out the position: relative rule, and try again. Now it works as expected. Placing a position: relative rule changes the behavior of contenteditable. 😱😱😱

In Chrome/Firefox, this problem does not occur.