Почему элементы добавляются в непредсказуемом месте?

Question

[copal]

Начать хочу с примера на codepen который иллюстрирует непредсказуемое добавление элементов. Конкретных вопросов слишком много, поэтому я объединю их в один - непонимание чего привело меня к созданию этого недоразумения?

Answer 1

[Алексей]

codepen.io/skazi_premiere/pen/oxWPjO
Вы оси перепутали

top: `${event.clientY}px`,
left: `${event.clientX}px`