可编辑的div无内容时聚焦无光标以及内容为纯字母时的不换行问题

这个是项目中遇到的 一个小问题 ，在此记录一下，我们项目有个地方用到了可编辑的div，即contenteditable=“true”,但是在chrome下有个问题，就是在没有任何内容的情况下聚焦时没有光标，下面用CSS解决一下：

.outEditableDiv{ 
   outline: none;
   word-break: break-all; // 解决纯字母时不自动换行问题
   &:empty:before {
     content: attr(data-placeholder);
   }
   &:focus:before {
     content: ' '; // 解决无内容时聚焦没有光标
   }
}