Firefox 设置了错误的插入符号位置 content插入 img 标签时可编辑-解网

问：

当我在浏览器（如 Chrome、Edge 等）中插入图像时，一切都很正常......但是，当我使用firefox插入符号位置时，位置是倾斜的。我不知道发生了什么，请帮帮我。先谢谢你。这是我的简单代码：contenteditable

.img-styl-cted {
  vertical-align: middle;
  width: 24px;
  height: 24px;
  display: inline-block;
  padding-left: 2px;
  padding-right: 2px;
}

.div-ctedab {
  padding:10px;
  border: 1px solid;
}

<div contenteditable class="div-ctedab">
<img src="https://images.immediate.co.uk/production/volatile/sites/3/2023/03/goku-dragon-ball-guru-824x490-11b2006.jpg" class="img-styl-cted"><img src="https://images.immediate.co.uk/production/volatile/sites/3/2023/03/goku-dragon-ball-guru-824x490-11b2006.jpg" class="img-styl-cted"><img src="https://images.immediate.co.uk/production/volatile/sites/3/2023/03/goku-dragon-ball-guru-824x490-11b2006.jpg" class="img-styl-cted">
</div>

这就是 Chrome、Edge 中显示的内容......

display in chrome

Firefox的倾斜程度如下：

firefox display

直到现在我还没有任何解决方案，我希望有人能分享这个问题的解决方案

HTML CSS Firefox 浏览器内容可编辑

Firefox 设置了错误的插入符号位置 content插入 img 标签时可编辑

Firefox sets wrong caret position contentEditable when insert img tag

评论