diff options
Diffstat (limited to 'testing/web-platform/tests/webvtt/rendering/cues-with-video/processing-model/evil/9_cues_overlapping_completely_all_cues_have_same_timestamp-ref.html')
-rw-r--r-- | testing/web-platform/tests/webvtt/rendering/cues-with-video/processing-model/evil/9_cues_overlapping_completely_all_cues_have_same_timestamp-ref.html | 112 |
1 files changed, 112 insertions, 0 deletions
diff --git a/testing/web-platform/tests/webvtt/rendering/cues-with-video/processing-model/evil/9_cues_overlapping_completely_all_cues_have_same_timestamp-ref.html b/testing/web-platform/tests/webvtt/rendering/cues-with-video/processing-model/evil/9_cues_overlapping_completely_all_cues_have_same_timestamp-ref.html new file mode 100644 index 000000000..66140c015 --- /dev/null +++ b/testing/web-platform/tests/webvtt/rendering/cues-with-video/processing-model/evil/9_cues_overlapping_completely_all_cues_have_same_timestamp-ref.html @@ -0,0 +1,112 @@ +<!DOCTYPE html> +<title>Reference for WebVTT rendering, repositioning of 9 cues that overlap completely and all cues have the same timestamp</title> +<style> +.video { + display: inline-block; + width: 720px; + height: 720px; + outline: solid; + position: relative +} +#cue1 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: -18px; + margin-left: -18px; + color: #000 +} +#cue2 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: -54px; + margin-left: -18px; + color: #222 +} +#cue3 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: -18px; + margin-left: -54px; + color: #444 +} +#cue4 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: -18px; + margin-left: 18px; + color: #666 +} +#cue5 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: 18px; + margin-left: -18px; + color: #888 +} +#cue6 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: -54px; + margin-left: -54px; + color: #aaa +} +#cue7 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: -54px; + margin-left: 18px; + color: #ccc +} +#cue8 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: 18px; + margin-left: -54px; + color: #eee +} +#cue9 { + position: absolute; + top: 50%; + left: 50%; + right: 0; + margin-top: 18px; + margin-left: 18px; + color: green +} +.cue { + width: 36px; + text-align: center +} +.cue > span { + font-family: Ahem, sans-serif; + background: rgba(0,0,0,0.8); + font-size: 36px; +} +</style> +<div class="video"> + <span class="cue" id="cue1"><span>1</span></span> + <span class="cue" id="cue2"><span>2</span></span> + <span class="cue" id="cue3"><span>3</span></span> + <span class="cue" id="cue4"><span>4</span></span> + <span class="cue" id="cue5"><span>5</span></span> + <span class="cue" id="cue6"><span>6</span></span> + <span class="cue" id="cue7"><span>7</span></span> + <span class="cue" id="cue8"><span>8</span></span> + <span class="cue" id="cue9"><span>9</span></span> +</div> |