title: How can I get the "drop caret position" from contenteditable?
body: <p>If one drags an element from within a <code>contenteditable</code> the browser usually shows such an "intermediate caret" as can be seen in the image below:</p>
  
  <p><a href="https://i.stack.imgur.com/mAJvM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mAJvM.png" alt="enter image description here"></a></p>
  
  <p>I am looking for a simple and reliable solution to drag an element from within a <code>contenteditable</code> by sending the elements ID as transfer data via drag and drop. Then, in the <code>ondrop</code> method I intend to place the <code>draggable</code> at the exact position where this "intermediate caret" is currently at.</p>
  
  <p>The question is: Will I be able to get this information from all the browsers?</p>
  
  <p>I do have a base (<a href="https://jsfiddle.net/ft02zpmp/" rel="nofollow noreferrer">JSFiddle</a>) but that's far from being useful for me at the moment.</p>
  
  <p>PS: I am not using jQuery or any other libraries.</p>