Skip to content

[css-display-3] Clarify display for ::first-line and ::first-letter #9958

@karlcow

Description

@karlcow

Intro Comment

This issue was led by a discussion about a test on WPT.
http://wpt.live/css/css-display/display-first-line-001.html
https://github.com/web-platform-tests/wpt/blob/34dd07ed48/css/css-display/display-first-line-001.html

For example:

<style>
#t1::first-letter { float: left; display: flex; font-size: 30px }
</style>
<div id="t1">First letter is float and flex.</div>

and the test is

assert_equals(getFirstLetterDisplayFor("t1"), "block");

The test would gain to be improved by having

<div id="t1">First letter is specified as float and flex, but should return block for display</div>

So that led to searching in the spec to understand why it was supposed to be block, hence the issue:

The issue

In https://drafts.csswg.org/css-display/#placement

None of the properties in this module apply to the ::first-line or ::first-letter pseudo-elements.

but at the same time display defines its initial value as inline. So why would it be block?

Let's head for https://drafts.csswg.org/css-display/#transformations
In an example section, it says:

Absolute positioning or floating an element blockifies the box’s display type. [CSS2]

Pointing to the text just a bit above.

Some layout effects require blockification or inlinification of the box type, which sets the box’s computed outer display type to block or inline (respectively). (This has no effect on display types that generate no box at all, such as none or contents.)

So that's the answer which is part of the CSS display, so… some part of this module applies to ::first-line or ::first-letter.

So the sentence could be probably clarified

None of the properties in this module apply to the ::first-line or ::first-letter pseudo-elements.

Thanks @annevk and @anttijk for the discussions.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions