JSFiddle - React, Tailwind, and code Playground

HTML

<div id="testDiv" contentEditable="false">
    Hey <input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/>
</div>

<div id="testDiv" contentEditable="true">
    Hey <div contentEditable="true"><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></div> <div contentEditable="true"><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></div><div contentEditable="true"><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></div><div contentEditable="true"><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></div>
</div>

<div id="testDiv" contentEditable="true">
    Hey <span contentEditable="true"><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></span> <span contentEditable="true"><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></span><span contentEditable="true"><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></span><span contentEditable="true"><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></span>
</div>

<div id="testDiv" contentEditable="true">
    Hey <a><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></a> <a><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button" tabindex="-1" value="Rob"/></a> <a><input id="user-tag-1" class="ut ut-full-name" carpos="9" type="button"...

CSS

#testDiv {
    height: 100px;
    width: 500px;
    border: 1px solid #C8C8C8;
    padding: 10px;
    background: #FFFFFF;
}
#caretPosition {
    float:left;
    margin-top:10px;
    font-weight: bold;
    font-size: 20px;
}
#navigation {
    float:left;
    width: 200px;
}
button {
    margin-top: 10px;
    padding: 5px;
    display:block;
}
.ut {
    background: none repeat scroll 0 0 #EEEEEE;
    border: 1px solid #DDDDDD;
    border-radius: 2px 2px 2px 2px;
    color: #427FED;
    display: inline-block;
    font: 13px/1.4 Roboto,arial,sans-serif;
    margin: 0 1px;
    padding: 0 1px;
    vertical-align: baseline;
    white-space: nowrap;
}