start_alignment-ref.html (1047B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <html class="reftest-wait"> 4 <title>WebVTT rendering, set align start and the cue contains two lines with different writing directions</title> 5 <script src="/common/reftest-wait.js"></script> 6 <style> 7 html { overflow:hidden } 8 body { margin:0 } 9 .video { 10 display: inline-block; 11 width: 320px; 12 height: 180px; 13 position: relative; 14 font-size: 9px; 15 } 16 .cue { 17 position: absolute; 18 top: 0; 19 bottom: 0; 20 left: 0; 21 right: 0; 22 text-align: start; 23 unicode-bidi: plaintext; 24 } 25 .cueText { 26 font-family: sans-serif; 27 background: rgba(0,0,0,0.8); 28 color: green; 29 } 30 </style> 31 <div class="video"> 32 <video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();"> 33 <source src="/media/white.webm" type="video/webm"> 34 <source src="/media/white.mp4" type="video/mp4"> 35 </video> 36 <span class="cue"> 37 <span class="cueText">Hello!</span><br> 38 <span class="cueText">שלום!</span> 39 </span> 40 </div> 41 </html>