html – FireFox中的`contenteditable = true`身高问题

html – FireFox中的`contenteditable = true`身高问题,第1张

概述如果有一个空的div,其中contenteditable =“true”: CSS: [contenteditable="true"] { border: 1px dashed #dedede; padding: 3px;} HTML: <div contenteditable="true"> <!-- blank by default --></div> 在IE和Ch 如果有一个空的div,其中contenteditable =“true”:

CSS:

[contenteditable="true"] {    border: 1px dashed #dedede;    @R_301_5095@: 3px;}

HTML:

<div contenteditable="true">    <!-- blank by default --></div>

在IE和Chrome中,它显示高度,就像具有小填充的普通输入字段一样.在firefox中,它只显示我在样式中添加的3px填充.没有,它崩溃,只有边界高.

你知道这是不是firefox的BUG?你能建议一种处理它的方法吗?

解决方法 解决方法:
[contenteditable='true']:before {    content: "\feff ";}

CSS2 section 10.6.3:

The element’s height is the distance from its top content edge to the first applicable of the following:

the bottom edge of the last line Box,if the Box establishes a inline formatting context with one or more lines the bottom edge of the bottom (possibly collapsed) margin of its last in-flow child,if the child’s bottom margin does not collapse with the element’s bottom margin the bottom border edge of the last in-flow child whose top margin doesn’t collapse with the element’s bottom margin zero,otherwise

对于这个空div,

1到3不适用,因为div是空的.它没有行框或儿童.
因此第4项适用.

解决方法在div中强制执行至少一个行框,以使其达到非零高度.

总结

以上是内存溢出为你收集整理的html – FireFox中的`contenteditable = true`身高问题全部内容,希望文章能够帮你解决html – FireFox中的`contenteditable = true`身高问题所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1141691.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-31
下一篇 2022-05-31

发表评论

登录后才能评论

评论列表(0条)

保存