Font styling section doesn't match reality

[emilio]

The spec says:

The font shorthand property on the (root) list of WebVTT Node Objects must be set to 5vh sans-serif.

However browsers don't do that:

• Gecko uses 5% of the video element height (code).
• Blink uses 5% of the smaller of video element width or height (code).
• WebKit seems to just use a fixed value based off preferences? (code).

It seems per #489 the idea is that these are relative to the video size?

[Pehrsons]

Similarly:

Every WebVTT region object is initialized with the following CSS settings:
(...)

• the font shorthand property must be set to 5vh sans-serif

[silviapfeiffer]

5vh means 5% of the video height, so the implementations are at least partially aligned.

[emilio]

5vh means 5% of the video height, so the implementations are at least partially aligned.

How so? https://drafts.csswg.org/css-values/#viewport-relative-lengths doesn't say that :)

[silviapfeiffer]

Yes it does. You need to understand that it is defined relative to CSS constructs such as the initial containing block, which is the CSS box into which the video pixels are rendered

[emilio]

Yes it does. You need to understand that it is defined relative to CSS constructs such as the initial containing block, which is the CSS box into which the video pixels are rendered

That's not the meaning of the ICB in CSS? The CSS2 spec says:

The containing block in which the root element lives is a rectangle called the initial containing block. For continuous media, it has the dimensions of the viewport and is anchored at the canvas origin; it is the page area for paged media. The 'direction' property of the initial containing block is the same as for the root element.

And WebVTT is not overriding that in any way...

[silviapfeiffer]

Keep going! The viewport is what the video pixels are rendered into.

[emilio]

It is not? The viewport in CSS 2 is the layout viewport, which is the page's viewport (what media queries match against for example). Afaict WebVTT is not using an <iframe> or anything like that (which implies a new document, a new root element, and a new viewport).

[emilio]

Or at least, if the intention of the WebVTT spec is that it creates a fully isolated context, like iframes do, it should be much more explicit about it :)

[silviapfeiffer]

CSS is quite explicit that continuous media (like video) create their own viewport.

[emilio]

Agree to disagree I guess... If it did create its own context / viewport / etc, you wouldn't be able to reach elements from inside via ::cue and so forth, which is no wonder why all engines don't follow that definition for vw / vh. Similar thing for inline SVG, it doesn't magically redefine viewport units.

Anyways this is all kind of a tangent. The question is whether the font-size should be 5% of the video height (Firefox), 5% of the minimum dimension of the two (Chromium), something else? :)

[silviapfeiffer]

The :: is to overcome the context boundary.

But yes, the discussion was always to be 5% of the video height.

[emilio]

cc @dandclark, do you know if this is intentional on the chromium side? We've found sites that kinda depend on it (but mostly because of #530, since they can't make the line spacing smaller)

[gkatsev]

A couple of points:

• Viewport Units and Styling #489 specifies my thoughts on how viewport units specified on webvtt should reference the video rendering area as the containing block.
• The spec currently does say that the size should be relative to the height. However, as per Default font size 5vh leads to very large cues for vertical videos #522, this can lead to bad view experience when used with vertical videos. The consensus there was that the spec should change to specify to use 5vmin rather than 5vh. If chromium is already doing so, it makes it easier to change the spec.

[jernoble]

In #522, we mentioned a possibility of replacing 5vmin with 5cqmin. I think the term "viewport" is likely overloaded, and using "containment context" instead would bring us into alignment with CSS, but it would require us to define what that "containment context" is.