CSS规范的哪部分描述了在innerHTML开头插入空格时的行为?

huangapple go评论59阅读模式
英文:

Which part of the CSS spec describes the behavior when a space is inserted at the beginning of innerHTML?

问题

我明白了,你只需要代码部分的翻译。以下是翻译好的内容:

<html>
    <head>
        <style>
            section { height: 120px; background: gray; width: 100px; font-size: 100px;}
            div { display: inline-block; }
            .a { background: red ; height: 50px; width: 20px}
            .b { background: cyan; height: 50px; width: 20px}
        </style>
    </head>
    <body>
        <section> <div class="a"></div><div class="b"></div></section>
    </body>
</html>
英文:

Question:

Which part of the official CSS spec (from csswg.org or w3.org) describes the behavior when a space is inserted at the beginning of innerHTML?

In the following experiment, Chrome produces a different result from JsFiddle. Who is correct?

Thanks!
CSS规范的哪部分描述了在innerHTML开头插入空格时的行为?

Results in Chrome/Firefox/Edge:

CSS规范的哪部分描述了在innerHTML开头插入空格时的行为?

Results in JsFiddle/CodePen:

https://jsfiddle.net/emmaJsFiddle/g6qjy8fd/11/

CSS规范的哪部分描述了在innerHTML开头插入空格时的行为?

Appendix 2: Source Code:

<html>
    <head>
        <style>
            section { height: 120px; background: gray; width: 100px; font-size: 100px;}
            div { display: inline-block; }
            .a { background: red ; height: 50px; width: 20px}
            .b { background: cyan; height: 50px; width: 20px}
        </style>
    </head>
    <body>
        <section> <div class="a"></div><div class="b"></div></section>
    </body>
</html>

答案1

得分: 1

这部分解释了在某些情况下(例如内容完全由内联元素组成时),计算行框高度会忽略行高:

链接:https://quirks.spec.whatwg.org/#the-blocks-ignore-line-height-quirk

引用自 whatwg.org:

3.4. 块级元素忽略行高特殊情况 在特殊模式和有限特殊模式下,对于内容由内联级别元素组成的块级容器元素,元素的行高必须在计算元素内行框的最小高度时被忽略。

英文:

This section explains that the calculation of the line box's height ignores line-height in certain cases (such as when the content is composed of inline elements only):

https://quirks.spec.whatwg.org/#the-blocks-ignore-line-height-quirk

<hr>
Quote from whatwg.org:

> 3.4. The blocks ignore line-height quirk In quirks mode and limited-quirks mode, for a block container element whose content is
> composed of inline-level elements, the element’s line-height must be
> ignored for the purpose of calculating the minimal height of line
> boxes within the element.

huangapple
  • 本文由 发表于 2023年7月3日 05:13:02
  • 转载请务必保留本文链接:https://go.coder-hub.com/76600829.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定