Clicking outside a contenteditable div stills give focus to it?

Question

For some reason I need to use contenteditable div instead of normal text input for inputting text. (for some javascript library) It works fine until I found that when I set

Answer 1

If it's not needed to use display: inline-block, I would recommend using float. Here is the example.

Based on your example, the new CSS would be:

div.text-input {
  display: block;
  background-color: black;
  color: white;
  width: 300px;
  float: left;
  margin-right: 10px;
}
div.unrelated {
  clear: both;
}