如果有一个空的div,其中contenteditable =“true”:
CSS:
- [contenteditable="true"] {
- border: 1px dashed #dedede;
- padding: 3px;
- }
HTML:
- <div contenteditable="true">
- <!-- blank by default -->
- </div>
在IE和Chrome中,它显示高度,就像具有小填充的普通输入字段一样.在Firefox中,它只显示我在样式中添加的3px填充.没有,它崩溃,只有边界高.
你知道这是不是Firefox的bug?你能建议一种处理它的方法吗?
解决方法
解决方法:
- [contenteditable='true']:before {
- content: "\feff ";
- }
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中强制执行至少一个行框,以使其达到非零高度.