Testing WebVTT captions some more so I can compare them to how YouTube renders the captions vs Quicktime and browsers.
Html 5 and Quicktime render a little differently (not shown here). Quicktime with WebVTT captions embedded in the video has a built-in ‘safe-area’ where it displays Closed Captions, so captions can’t be displayed right at the edges of the video.
Youtube has some quirks. Left align does not work, vertical position is uneven, and right align only works if you add a space after the colon in the markup (i.e. “align: right” works, “align:right” does not.)
mp4 video below with sidecar WebVTT Closed Captions:
Youtube video with the same WebVTT Closed Captions file showing inconsistencies in vertical spacing and left alignment that doesn’t work.
