[css-text] hanging punctuation: ink vs scrollable overflow

[frivoal]

original mail thread starts here (sub-point 6)

key arguments for and against:

---

The WG resolved overflow is ink overflow. I think it should be scrollable overflow. I can elaborate on this if needed, but it’s a selectable character that has to be reachable when edited and cut/copied etc. Any designer is going to leave space for hanging punctuation if they turn it on, so fears of scrollbars are unfounded IMO. It’s also an annoying amount of additional work to treat that as ink overflow when the common sense implementation just moves the line box (and line boxes are scrollable overflow obviously). This is similar to text-indent, which creates layout overflow when negative, so it’s not clear to me why hanging punctuation can’t behave the same way.

---

The reason that we decided to make it an ink overflow is that, many
punctuations in CJK are full-width while their ink just takes less than
half of the space. It is especially true for Simplified Chinese and
Japanese, for stop and comma. It means that, it is completely fine to have
a space which is enough to show the ink but not enough from the metrics.
Making hanging punctuation scrollable overflow could confuse people in this
reasonable usecase.

---

Also, we've made preserved white-space at the end of a line be treated as hanging for the specific purposed of having it be ink overflow.

---

I would suggest:

• must be treated as ink overflow in the general case
• must be treated as scrollable overflow when editable

[css-meeting-bot]

The Working Group just discussed hanging-punctuation and overflow, and agreed to the following resolutions:

• RESOLVED: define hanging punctuation as scrollable overflow in all cases

The full IRC log of that discussion

<fantasai> Topic: hanging-punctuation and overflow
<fantasai> https://drafts.csswg.org/css-text-3/issues-lc-2013#issue-123
<dael> GITHUB: https://github.com//issues/2398
<fantasai> github: https://github.com//issues/2398
<dael> fantasai: This is about if hanging punct is ink or scroll overflow. Current prop is that it must be treated as ink in the general case and scrollable when editable.
<dael> astearns: Threading the needle.
<dael> fremy: Test case?
<dael> fantasai: Try to make one.
<dael> florian: Overall ink is preferable, esp Japanese punctuation marks. If you make them scrollable authors are in trouble because if they have 1/2em overflow you have invisible text. However when you're editing you want to get to everything.
<dael> myles: Would there be a case for less them 1em?
<dael> florian: Yes because it doesn't look 1em. The glyph is 1em and the ink is not.
<dael> myles: If hanging punct is 1 character.
<dael> florian: Charaters that hang don't fill box.
<dael> myles: Ink doesn't. I want to look at actual examples because my inturition is that because a character hangs there would be 1 em of actual space.
<dael> florian: The insutation of [missed] is that it would be less. It is not a full width character and should have the size ink indicates and the rest is a historical accident back to typing with blocks. People thinking of it as the space it consumes. BUt I don't have data.
<dael> florian: Expert opinion. Not data.
<astearns> s/[missed]/kobayashi-san
<dael> koji: Hanging punct in CJK looks more natural in ink but David Hyatt did the scrollable overflow.
<dael> florian: I think scrollable will trigger a bunch of scrollbars
<dael> fantasai: When you have a scrollbar you dont want text to run against he edge of the scrollbar. You want breathing which is typically > 1/2em. A bunch of text in a scrollable cotnainer would have an em of padding
<dael> florian: A container that's overflow:auto with intent that the scrollbars will never appear .
<dael> myles: If fear is we'll create a bunch of scrollbars let's try and see
<dael> florian: Another piece of issue is that we're also saying preserved white space when there's too much it's treated as hanging and you would also cause scrollbars
<dael> fantasai: Advantage of scrollable overflow is when you're tyring to select them you can see them.
<dael> myles: If there's not collapsable spaces you should be able to get to the spaces.
<dael> myles: Having non-collapsed spaces and being editable are separate.
<dael> florian: For editing they must be scrollable. If that's true in the general case I worry about scrollbars allover.
<dael> koji: Only webkit impl. If webkit can try it out.
<fantasai> http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C!DOCTYPE%20html%3E%0A%3Cstyle%3E%0A%40supports%20(hanging-punctuation%3A%20last)%20%7B%20html%20%7B%20background%3A%20green%3B%20%7D%20%7D%0A%3C%2Fstyle%3E%0A%3Cdiv%20style%3D%22width%3A%204em%3B%20border%3A%20solid%20silver%3B%20hanging-punctuation%3A%20force-end%22%3E%0A%E4%B8%80%E4%BA%9B%E6%B1%89%E5%AD%97%E3%80%82%20
<dael> fantasai: You treat it as ink overflow?
<dael> myles: I believe so.
<JohnDoe> Romoving word-break:break-word is big mistake https://github.com//issues/2390
<dael> fantasai: Test case^
<dael> fantasai: Add overflow scroll to it.
<JohnDoe> Github: https://github.com//issues/2390
<dael> myles: Not scrollable.
<dael> github: https://github.com//issues/2398
<dael> [fiddling with test case]
<dael> myles: Inconclusive. I can't get anything to hang over.
<dael> florian: From PoV of editing with a single punct overflowing it wont be a big different. It's preferable scrollable.
<dael> myles: So it should be scrollable overflow and if it's a problem we can come back.
<dael> astearns: Sounds like we have consensus to define hanging punctuation as scrollable overflow.
<dael> astearns: Do we want a note about concerns?
<dael> fantasai: I think people can complain about it.
<dael> astearns: Objections to define hanging punctuation as scrollable overflow in all cases?
<dael> RESOLVED: define hanging punctuation as scrollable overflow in all cases
<fantasai> https://drafts.csswg.org/css-text-3/issues-lc-2013#issue-133
<fantasai> github: https://github.com//issues/869
<dael> github: https://github.com//issues/2398

[frivoal]

Pull Requests submitted:

• Spec PR
• WPT PR