W3C home > Mailing lists > Public > public-css-archive@w3.org > August 2020

Re: [csswg-drafts] [css-pseudo] Problems with styling ::first-letter with punctuation (#2040)

From: CSS Meeting Bot via GitHub <sysbot+gh@w3.org>
Date: Thu, 06 Aug 2020 00:01:00 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-669605615-1596672059-sysbot+gh@w3.org>
The CSS Working Group just discussed `[css-pseudo] Problems with styling ::first-letter with punctuation`.

<details><summary>The full IRC log of that discussion</summary>
&lt;dael> Topic: [css-pseudo] Problems with styling ::first-letter with punctuation<br>
&lt;dael> github: https://github.com/w3c/csswg-drafts/issues/2040<br>
&lt;dael> Rossen_: Linked to a lengthier topic from the F2F<br>
&lt;dael> fantasai: As I'm sure many of you saw during F2F when debating drop-caps typical way to present punct like opening quote is style with different font and styling that's closer to paragraph rather than initial-letter<br>
&lt;dael> fantasai: Not always the same as paragraph. Positioned in relation to initial-letter<br>
&lt;dael> fantasai: Super common and a problem for people trying to use drop-caps.<br>
&lt;dael> fantasai: A number of issues surrounding this aspect. Some are about hanging punct, but also being able to select it.<br>
&lt;dael> fantasai: Prop is we add a pseudo-element.<br>
&lt;dael> fantasai: Two prop one is first-punctuation and the other is ::puntuation pseudo class attached to first-letter<br>
&lt;myles> q+ to ask if ::punctuation would apply outside of ::first-letter<br>
&lt;dael> fantasai: You can have multi-characters but you can't have them in the middle b/c only one letter<br>
&lt;Rossen_> ack myles<br>
&lt;Zakim> myles, you wanted to ask if ::punctuation would apply outside of ::first-letter<br>
&lt;dael> myles: Would ::punctuation apply outside of ::first-letter?<br>
&lt;fantasai> ::first-letter::punctuation<br>
&lt;dael> fantasai: I think that would be bad. I think it would be required to be attached to first-letter. You could write ^ but anything else invalid.<br>
&lt;dael> AmeliaBR: I don't want to get into compleixyt of general punct pseudo element. THis is parts of first-letter other than letter.<br>
&lt;dael> myles: Sounds like name is bad<br>
&lt;dael> fantasai: It's selecting punctuation<br>
&lt;myles> s/like name/like the name "punctuation"/<br>
&lt;dael> fantasai: Once concern I have with that approach is in many cases the special style you want is only punct before but not after. There's the one in plinss comment. The em-dash in opening quote would be styled vertically middle to the L but the quote would not read properly there.<br>
&lt;dael> fantasai: If doing special alignment you only want leading but not trailing.<br>
&lt;dael> florian: Is it not included in first-letter pseudo?<br>
&lt;fantasai> –«L'<br>
&lt;dael> fantasai: It is. All the punct in plinss comment is in first-letter pseudo<br>
&lt;AmeliaBR> In “I'm here.”, the “I' are all part of ::first-letter<br>
&lt;dael> fantasai: You have ^ sequence. If we have ::punctuation it doens't make sense for the first 2 to be selected but not the last, but you do need to be able to select them separately<br>
&lt;dael> AmeliaBR: Visual examples I've seen it's only the bits before styled differently<br>
&lt;dael> AmeliaBR: Probably okay at this point to focus on that part. If we see examples to style the after different we can handle it<br>
&lt;dael> florian: I think we've seen some<br>
&lt;dael> AmeliaBR: We need to distinguish them b/c styles not the same<br>
&lt;dael> AmeliaBR: first-letter before-the-letter<br>
&lt;dael> plinss: My prop was apply pseudo classes to those pseudo elements<br>
&lt;dael> florian: So it selects a run and you can do first-of-type and last-of-tyme<br>
&lt;dael> plinss: "L' you have two punctuation pseudo elements<br>
&lt;dael> florian: em-dash " letter punct do you get 2?<br>
&lt;dael> plinss: That was a question in my comment. Several ways of doing it. If there's spce def multiple pseudo elements. If no space don't know<br>
&lt;dael> fantasai: An entire sequence of punct incl the space might be single unit. Flexible with U20 but not other space<br>
&lt;dael> plinss: Looking for use cases with em-dash and quote do you want to style different<br>
&lt;fantasai> https://github.com/w3c/csswg-drafts/issues/5154#issuecomment-659129316<br>
&lt;dael> fantasai: Yes, there was an example ^<br>
&lt;dael> plinss: THen different punct pseudo elements<br>
&lt;dael> fantasai: em-dash and opening quote look same and following different<br>
&lt;dael> plinss: Is there a use case to style differently?<br>
&lt;dael> fantasai: I think that low level we say you should put markup. We should do common case and opening punct being adjusted is common. multi opening punct styled independently might not be common enough for support<br>
&lt;dael> plinss: If you wrap punct in a span they're all in ::first-letter<br>
&lt;dael> fantasai: Insied of them<br>
&lt;dael> fantasai: The people who want to style multi leading punct differently is a very small case. I think when you have the case you markup special without first-letter.<br>
&lt;dael> florian: Concern with impl complexity. If we go character by character the pseudo will be tree abiding but if we grab a bunch it's not always. first-letter is already a mess so manybe not worse, but might be adding<br>
&lt;dael> myles: Why can't ask authors to surround punct with spans? This is getting complex, can't we get authors to do it explicitly?<br>
&lt;Rossen_> q<br>
&lt;dael> fantasai: Once you do that you can't use first-letter. Also, this is a common case. If it was unusal I'd say put a bunch of spans. General case of opening punct being different is part of basic drop cap styling. If we want drop cap to be usable we'll need to support it.<br>
&lt;dael> florian: A run of punct in punct pseudo and you can get 2 of them is good enough for general use case and if you want more complex you pile in spans. I do wonder about impl complexity<br>
&lt;heycam> +1 to the complexity concerns around having the run of punctuation, since it will be non-tree-abiding<br>
&lt;fantasai> s/of spans/of spans, hope that implementers support initial-letter styling on arbitrary spans soon/<br>
&lt;dael> fantasai: I don't have strong opinion of individual or a run. If they are wrap independently will they be kerned together? If it breaks kerning it's a problem. If no doesn't matter much<br>
&lt;dael> florian: If independent we need to get spaces in pseudo<br>
&lt;dael> fantasai: Yeah<br>
&lt;dael> myles: webkit breaks kerning between elements and we view that as a bug. We shouldn't assume different pseudo elements break kerning<br>
&lt;heycam> I am wondering whether the kinds of styles authors want to apply to the punctuation is limited enough that we should handle this with a property rather than more pseudos<br>
&lt;dael> fantasai: What if you have 2 elements side by side. Normally no styling, but give both vertical-align:super will they continue to be a single line? part of problem here is aligning differently here.<br>
&lt;heycam> (for the common cases we want to support)<br>
&lt;fantasai> heycam, I don't think it is... because they want to tweak the font (family, size, and color)<br>
&lt;fantasai> as well as vertical aligment<br>
&lt;dael> florian: Could we do a simplification here? In case of what to style run of punct together you're not having span boundries in the middle. Maybe could make that a tree abiding run?<br>
&lt;dael> fantasai: Yes, could work. Hvae allownces in first-letter if it breaks browser not required to do first-letter. We could do that<br>
&lt;dael> florian: Yeah, browser could do a weird thing that crosses boundary.<br>
&lt;dael> fantasai: Making it tree abiding should be completely possible<br>
&lt;dael> fantasai: So how do we select? punct selector punct selector attached to first-letter?<br>
&lt;dael> florian: Can you use first child or first of type?<br>
&lt;Rossen_> q?<br>
&lt;heycam> random wondering: will this pseudo match quotes inserted with the quotes property?<br>
&lt;dael> AmeliaBR: I don't think anything else with first-child on pseudo elements<br>
&lt;dael> myles: I think we're designing a new feature. Surely that's outside a call.<br>
&lt;myles> s/that's/that should be done/<br>
&lt;dael> AmeliaBR: Yeah. Probably back to issue. Whatever we do it must be tree abiding is one resolution<br>
&lt;dael> plinss: Was a prop for pseudo classes applying to pseudo elements<br>
&lt;dael> Rossen_: I think we went 360 around plinss suggestion. Most was restating how we arrive here.<br>
&lt;dael> Rossen_: Do we have any reasons why ::first-letter punctuation should have effect outside of first-letter? If not reduces choices quite a bit and it comes down to how do we allow pseudo class only on first-letter<br>
&lt;dael> plinss: One of the reasons why switching to ::punctuation we may want to allow in other cases like inside of marker, though not everything<br>
&lt;dael> fantasai: 1.3.4 it selects to period?<br>
&lt;dael> plinss: Maybe. We can look in the future. Why I'm suggesting a more generic name.<br>
&lt;dael> AmeliaBR: IN that case need to distinguish between before or after main thing. Still needs a modifier on punctuation pseudo element. If that's different name or combining pseudo classes we have to design that.<br>
&lt;dael> plinss: Ulterior motive to push pseudo classes<br>
&lt;dael> Rossen_: It's top of hour and we're not ready to resolve. We can continue next week if we're closer.<br>

GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2040#issuecomment-669605615 using your GitHub account

Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 6 August 2020 00:01:03 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:42:13 UTC