25637 2014-05-09 19:52:17 +0000 [WebVTT] Make the padding at the edges of the video overridable using CSS 2014-10-17 21:21:55 +0000 1 1 1 Unclassified TextTracks CG WebVTT unspecified PC All RESOLVED DUPLICATE 22085 P2 normal --- 1 philipj dave.null philipj silviapfeiffer1 public-texttracks oldest_to_newest 105570 0 philipj 2014-05-09 19:52:17 +0000 We currently have: The 'padding-top' and 'padding-bottom' property on the WebVTT cue background box must be set to '1.5vh' or another user-agent-defined number to define a padding at the edges of the video into which cues will not be placed. In situations with overscan, this padding should be sufficient to place a cue within the title-safe area. In the absence of overscan, this value should be picked for aesthetics (to avoid text being aligned precisely on the top or bottom edge of the video, which can be ugly). The 'padding-left' and 'padding-right' property on the WebVTT cue background box must be set to '1.5vw' or another user-agent-defined number to define a padding at the edges of the video into which cues will not be placed. In situations with overscan, this padding should be sufficient to place a cue within the title-safe area. In the absence of overscan, this value should be picked for aesthetics (to avoid text being aligned precisely on the top or bottom edge of the video, which can be ugly). It would be very nice if this were exposed to CSS, maybe with a default of 5vh to match the default line height. For the overscan situation, the user agent can simply have a user agent stylesheet with higher priority than author CSS. 105592 1 philipj 2014-05-09 21:39:20 +0000 Oh, I see that this is actually using the wrong box, the WebVTT cue background box is the anonymous box in "The children of the nodes must be wrapped in an anonymous box whose 'display' property has the value 'inline'." That means these two lines won't do anything useful: The 'box-sizing' property on the WebVTT cue background box must be set to 'border-box'. The 'overflow' property on the WebVTT cue background box must be set to 'hidden'. 105660 2 silviapfeiffer1 2014-05-12 01:17:13 +0000 Can we make the "cue box" that is specified in the Data Model (3.1) *be* the cue background box? 105707 3 philipj 2014-05-12 11:06:00 +0000 Do you mean http://dev.w3.org/html5/webvtt/#dfn-text-track-cue-box ? That's the box which is controlled by position, size and align, and it's a block box. The WebVTT cue background box is an inline box, so they can't be the same. 107524 4 silviapfeiffer1 2014-06-09 13:31:49 +0000 Let's make the block box explicit then and give it these properties. 'overflow' is not necessary since it was meant to deal with non-clamping cues, which is now getting removed again in bug 25660 . 107551 5 philipj 2014-06-09 21:37:53 +0000 What should the CSS for controlling this look like? ::cue-root { padding: 10px; } ? Or maybe ::cue { margin: 10px; } ? Do we want to be able to control the distance between individual cues? 107682 6 philipj 2014-06-11 20:35:44 +0000 Well oops, I left some bits like "minus twice the 'padding-top' space defined in the next section" when I removed the CSS settings in https://github.com/w3c/webvtt/pull/79 That should be fixed as part of this issue. 107725 7 silviapfeiffer1 2014-06-12 13:25:54 +0000 (In reply to Philip Jägenstedt from comment #5) > What should the CSS for controlling this look like? > > ::cue-root { padding: 10px; } ? > > Or maybe ::cue { margin: 10px; } ? > > Do we want to be able to control the distance between individual cues? ::cue { padding:10px; } seems good. I don't see a need to introduce a new pseudo-element for this. 113396 8 philipj 2014-10-17 21:21:55 +0000 *** This bug has been marked as a duplicate of bug 22085 ***