Re: [csswg-drafts] [css-inline-3] initial-letters; feedback from implementation (#4171)

The CSS Working Group just discussed `[css-inline-3] initial-letters; feedback from implementation`, and agreed to the following:

* ``RESOLVED: Use shape-margin on initial letter when shape-outside is none and `inlitial-letters-wrap: all` ``

<details><summary>The full IRC log of that discussion</summary>
&lt;RossenF2F> Topic: [css-inline-3] initial-letters; feedback from implementation<br>
&lt;RossenF2F> github: https://github.com/w3c/csswg-drafts/issues/4171<br>
&lt;emilio> faceless: we implemented initial-letters, it works broadly<br>
&lt;emilio> ... I think it should be simplified to work in non-latin baselines<br>
&lt;emilio> ... the way it's currently defined is that you specify the number of lines that is supposed to cover and the amount that it's supposed to shift<br>
&lt;emilio> ... the second parameter is redundant<br>
&lt;chris> which was the non-Safari implementation mentioned in passing? I couldn't hear<br>
&lt;emilio> ... we already got the ability to shifts baselines up / down using baseline-shift<br>
&lt;emilio> fantasai: I think there are a bunch of issues in this issue and we should take one at a time<br>
&lt;emilio> faceless: Sure. you can't add margins around the initial-letter... You can add some padding to the right<br>
&lt;emilio> ... but it's not great with varying shapes<br>
&lt;emilio> fantasai: so proposal would be to apply shape-margin only when wrapping around the glyph shape<br>
&lt;dbaron> sounds reasonable<br>
&lt;emilio> astearns: so for the rest we apply shape-outside<br>
&lt;emilio> fantasai: interaction between shape-outside and initial-letter is tbd<br>
&lt;emilio> ... but you can wrap around the glyph<br>
&lt;emilio> astearns: makes sense to use shape-margin when shape-outside is none and `initial-letters-wrap: all`<br>
&lt;florian> sounds good to me<br>
&lt;emilio> RESOLVED: Use shape-margin on initial letter when shape-outside is none and `inlitial-letters-wrap: all`<br>
&lt;fantasai> (we're skipping issue 2 in the issue, because it's covered in https://github.com/w3c/csswg-drafts/issues/719 )<br>
&lt;astearns> s/all/all and first/<br>
&lt;emilio> faceless: (describes issue 3 in #719)<br>
&lt;emilio> faceless: I think the text about the alignment points is not relevant<br>
&lt;emilio> ... once you drop the letter on the first-line it fits right<br>
&lt;emilio> fantasai: you need that for shifting caps, that's what it's for<br>
&lt;fantasai> s/shifting/raised or sunk/<br>
&lt;dbaron> I think this doesn't work both because it's hard to match the correct size, and because you need to control which lines wrap around the initial letter.<br>
&lt;emilio> s/that/the second value of `initial-letters`/<br>
&lt;emilio> faceless: I can try to demonstrate you can achieve the same effects without that value<br>
&lt;emilio> hober: I'd really love it if didn't file giant issues like this so that we can clear where the discussion is separately<br>
&lt;tantek> +1 hober<br>
&lt;emilio> ... this style of bug-filing is very hard to follow<br>
&lt;emilio> RossenF2F: That being said all the detail is awesome<br>
&lt;emilio> faceless: Let's move to issue 4... You can have atomic inlines as an initial letter, is that allowed? Otherwise it needs to be clarified how to align these<br>
&lt;chris> q+<br>
&lt;emilio> ... we discussed about having baselines on svg which would solve this problem, probably<br>
&lt;emilio> fantasai: we have an attempt to synthesize baselines for boxes<br>
&lt;emilio> ... so cap-height corresponds to top-height of the box<br>
&lt;RossenF2F> q?<br>
&lt;RossenF2F> ack chris<br>
&lt;emilio> chris: this has come up before for images<br>
&lt;fantasai> https://drafts.csswg.org/css-inline-3/#initial-letter-box-size<br>
&lt;emilio> myles: #4116 is the baselines in images<br>
&lt;fantasai> For atomic initial letters, sizing follows the usual rules for that type of atomic inline. However, if the box has an automatic block size (auto), then its block size is determined as for an inline initial letter with border-box alignment, and is definite.<br>
&lt;emilio> ... issue I filed a bug<br>
&lt;emilio> s/a bug/ a while ago<br>
&lt;chris> https://github.com/w3c/csswg-drafts/issues/4116<br>
&lt;emilio> iank_: this is not only for images right? Only atomic inlines<br>
&lt;emilio> other atomic inlines too*<br>
&lt;emilio> fantasai: I think the spec says how to size the box<br>
&lt;emilio> ... so if you set an explicit size on an atomic inline you get that size<br>
&lt;emilio> ... if the size doesn't match the amount of space you use the alignment properties to align it in that space<br>
&lt;emilio> faceless: I suspect that'd probably do it for now but probably should be explicit about how baselines work<br>
&lt;emilio> fantasai: agreed<br>
&lt;emilio> faceless: issue 5<br>
&lt;emilio> ... the spec allows for inlines as initial-letter<br>
&lt;emilio> ... the initial letter uses font-size not the computed size<br>
&lt;emilio> ... so if you use superscripts or what not it produces really odd result<br>
&lt;emilio> *results<br>
&lt;fantasai> scribenick: fantasai<br>
&lt;fantasai> on issue 6<br>
&lt;fantasai> faceless: If you have inlines as part of inial leter, e.g. a superscript in 1st, it doesn't scale up with the rest of the initial letter<br>
&lt;fantasai> emilio: what you're proposing is some weird inheritance behavior in first-lin<br>
&lt;fantasai> emilio: if you have span in first-line, it inherits from ::first-line<br>
&lt;fantasai> fantasai: There's regular element initial letters, and ::first-letter first-letters<br>
&lt;fantasai> fantasai: If can't have element in ::first-letter, then it's not a prolem there<br>
&lt;fantasai> fantasai: but for regular elements, shouldn't be a problem to inherit like usual<br>
&lt;fantasai> faceless: Should set the computed font size based on initial-letter, so that it will inherit as usual and affect the children<br>
&lt;fantasai> emilio: Not great, because a lot of stuff depends on font-size right now<br>
&lt;fantasai> emilio: would need t compute based on initial-letter<br>
&lt;fantasai> dbaron: Might be able to specify the desired results wihtout changing computed value of font-size<br>
&lt;fantasai> dbaron: might be more difficult to specify, but more realistic to implement<br>
&lt;fantasai> emilio: Can you set the initial-letter size in em units<br>
&lt;fantasai> faceless: no, it's derived from the algorithm<br>
&lt;fantasai> florian: The algorithm gives you the siz eof the glyph, if we say therefore this must affect the font size, do browsers agree on which font size you get from that<br>
&lt;emilio> fantasai: you have requirements for that calculation, to use specific metrics<br>
&lt;emilio> ... like, my line-height is X or Y, and the alphabetic-baseline<br>
&lt;emilio> ... that's all deterministic<br>
&lt;emilio> ... assuming everyone pulls the same metrics<br>
&lt;emilio> florian: is there a really a single font-size that gets you the right size?<br>
&lt;fantasai> fantasai: yes<br>
&lt;fantasai> fantasai: there's only one cap height metric<br>
&lt;fantasai> emilio: But the computed line height depends on the computed font size?<br>
&lt;dbaron> dbaron: modulo rounding issues<br>
&lt;fantasai> emilio: think it's more reasonable to not affect the computed value and then do something, but...<br>
&lt;fantasai> florian: Don't need the line-height/font-size of the initial letter, but of the paragraph<br>
&lt;RossenF2F> q?<br>
&lt;fantasai> emilio: but not easy to find that value at the time you're doing style computation<br>
&lt;dbaron> https://wiki.csswg.org/spec/property-dependencies<br>
&lt;fantasai> emilio: You cannot get to the containing block, you can get to the nearest display: contents thing...<br>
&lt;emilio> non-display: contents thing<br>
&lt;fantasai> dbaron: It's not super clear to me whether what you're proposing would make the computed value of font size on layout<br>
&lt;fantasai> dbaron: but even if it's not, still refer you to this dependency chart<br>
&lt;fantasai> dbaron: if you're proposing to add something, make sure it doesn't create a cycle<br>
&lt;fantasai> dbaron: font-size is one of the most basic dependencies<br>
&lt;fantasai> faceless: It definitely doesn't depend on layout<br>
&lt;fantasai> florian: Computed font size of initial-letter would not affect the lineh height of the parent paragraph, so no circularity<br>
&lt;fantasai> florian: The computed line-height of the initial letter affects nothing, so the loop stops here<br>
&lt;fantasai> emilio: affects nothing if you don't add lh units or other things that are proposed<br>
&lt;fantasai> florian: If you're trying to set the border of your initial-letter to 0.1lh, you can use it, but won't have ripple effects that mess up everything<br>
&lt;fantasai> emilio: I still think getting to the right parent paragraph's line-height is not trivial<br>
&lt;fantasai> florian: The alternative would be to say that within the initial-letter, a specific set of things do math against the used font-size instead?<br>
&lt;fantasai> emilio: You would need some kind of multiplier, which seems OK<br>
&lt;fantasai> emilio: You need to multiply by the ratio of the font-size of the initial letter to the computed font-size<br>
&lt;fantasai> florian: I'm not concerned about having the ratio, I'm concerned about the whitelist of what it applies to<br>
&lt;fantasai> florian: Not understanding the difficulty of inheriting through...<br>
&lt;fantasai> fantasai: DIscuss at break?<br>
&lt;fantasai> issue 7<br>
&lt;fantasai> faceless: inline boxes don't take width/height anywhere else, doesn't seem like a good idea here<br>
&lt;emilio> fantasai: the reason we did this is that you can't make an atomic inline into an initial letter it doesn't resize the font<br>
&lt;emilio> ... the content of the inline-block that is an initial letter are not affected by that<br>
&lt;emilio> ... what this does is you do the resizing of the glyph as usual<br>
&lt;emilio> ... but then you also define the size of the box<br>
&lt;emilio> ... this was requested by tantek<br>
&lt;emilio> faceless: alright, scratch that then<br>
&lt;emilio> astearns: it'd be nice to have a note/example in the spec<br>
&lt;fantasai> s/tantek/tantek, to handle the case of colored boxes with initial letters in them, wnat the boxes to all be the same size/<br>
&lt;emilio> faceless: number 8<br>
&lt;emilio> faceless: I'm ok dropping this<br>
&lt;emilio> dbaron: can I suggest that the issues that are viable after this discussion should become separate issues?<br>
&lt;emilio> ACTION: fantasai to go through the issues after doing the spec work and split the remaining issues<br>
&lt;emilio> (or mentor faceless into doing so)<br>
</details>


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

Received on Friday, 24 January 2020 12:33:03 UTC