W3C home > Mailing lists > Public > public-css-archive@w3.org > October 2016

[csswg-drafts] [css-pseudo][css-display] Interaction between run-in and ::first-letter

From: Florian Rivoal via GitHub <sysbot+gh@w3.org>
Date: Wed, 26 Oct 2016 15:50:19 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-185434385-1477497017-sysbot+gh@w3.org>
frivoal has just created a new issue for 
https://github.com/w3c/csswg-drafts:

== [css-pseudo][css-display] Interaction between run-in and 
::first-letter ==
Rescued from [an old 
mail](https://lists.w3.org/Archives/Public/www-style/2015Feb/0330.html),
 as I was doing some mailbox cleanup:

---

We briefly discussed the interaction of display:run-in and 
::first-letter during the f2f without reaching a conclusion.

Given the following markup & styling, it is not clear what will 
happen:
```css
h1, h2 {display: run-in; }
h1::first-letter { color: green; }
h2::first-letter { color: orange; }
p::first-letter { color: blue; }
```
```html
<h1>First title</h1>
<h2>Second title</h2>
<p>Lorem ipsum</p>
```

[CSS2.1 says](https://www.w3.org/TR/CSS21/selector.html#first-letter):
>The :first-letter pseudo-element must select the first letter of the 
first line of a block, if it is not preceded by any other content 
(such as images or inline tables) on its line.

[css-pseudo 
says](https://drafts.csswg.org/css-pseudo/#first-letter-pseudo):

>The ::first-letter pseudo-element represents the first typographic 
letter unit on the first formatted line of its originating element, if
 it is not preceded by any other content (such as images or inline 
tables) on its line.

p::first-letter should certainly not select 'L' and make it blue, as 
it is not "the first typographic letter unit on the first formatted 
line" or "The first letter of the first line of a block", and 
regardless of spec wording, it would be a bad idea for 'L' to be 
selected here.

Whether p::first-letter and h1::first-letter should select 'F' or 
nothing is a lot less clear to me, but I believe that at least one 
should.

Given that 

```css
 p::before {content: "A";}
 p::first-letter {color:green;}
```
```html
 <p>Lorem ipsum</p>
```
makes 'A' green, p::first-letter should match 'F' in the first 
example. Arguably this is already what the spec says, but the wording 
does not seem clear-cut to me.

As for "h1::first-letter", I am not sure what the what the spec 
intends, but it seems reasonable and useful that it would also match 
'F'.

Finally, it seems clear to me that h2::first-letter should not select 
'S', and I also don't think it would be good for it to select 'F'.

Should we fix/clarify the specs so that both p::first-letter and 
h1::first-letter match 'F', or does someone believe another behavior 
would be preferable?

Please view or discuss this issue at 
https://github.com/w3c/csswg-drafts/issues/650 using your GitHub 
account
Received on Wednesday, 26 October 2016 15:50:26 UTC

This archive was generated by hypermail 2.4.0 : Thursday, 24 March 2022 20:26:35 UTC