浏览器兼容 - contenteditable元素的光标不显示

版权声明：写文章辛苦，请不要复制粘贴，如果要，请注明来处 https://blog.csdn.net/u012627861/article/details/86483239

问题描述

代码如下

<span contenteditable="true"></span>

这句代码在Chrome下光标正常显示，但在Safari中无法显示光标。

解决办法

此时需要设置span的样式如下

span{
	display: inline-block;
	min-width: 1px;
}

分析

Safari下之所以不显示，是因为DOM元素的宽度不够光标显示，光标的宽度为1px，而这里span默认情况下是0px。