| OLD | NEW | 
|   1 <!DOCTYPE html> |   1 <!DOCTYPE html> | 
|   2 <title>Reference for WebVTT rendering, ::cue(v), outline shorthand</title> |   2 <title>Reference for WebVTT rendering, ::cue(v), outline shorthand</title> | 
|   3 <style> |   3 <style> | 
|   4 html { overflow:hidden } |   4 html { overflow:hidden } | 
|   5 body { margin:0 } |   5 body { margin:0 } | 
|   6 .video { |   6 .video { | 
|   7     display: inline-block; |   7     display: inline-block; | 
|   8     width: 1280px; |   8     width: 320px; | 
|   9     height: 720px; |   9     height: 180px; | 
|  10     position: relative |  10     position: relative; | 
 |  11     font-size: 9px; | 
|  11 } |  12 } | 
|  12 .cue { |  13 .cue { | 
|  13     position: absolute; |  14     position: absolute; | 
|  14     bottom: 0; |  15     bottom: 0; | 
|  15     left: 0; |  16     left: 0; | 
|  16     right: 0; |  17     right: 0; | 
|  17     text-align: center |  18     text-align: center | 
|  18 } |  19 } | 
|  19 .cue > span { |  20 .cue > span { | 
|  20     font-family: sans-serif; |  21     font-family: sans-serif; | 
|  21     background: rgba(0,0,0,0.8); |  22     background: rgba(0,0,0,0.8); | 
|  22     font-size: 36px; |  | 
|  23     color: white; |  23     color: white; | 
|  24 } |  24 } | 
|  25 .cue > span > span { |  25 .cue > span > span { | 
|  26     display: inline-block; |  26     display: inline-block; | 
|  27     margin-left: -2px; |  27     margin-left: -2px; | 
|  28     margin-right: -2px; |  28     margin-right: -2px; | 
|  29     border: solid #00f 2px; |  29     border: solid #00f 2px; | 
|  30     border-bottom: none; |  30     border-bottom: none; | 
|  31 } |  31 } | 
|  32 </style> |  32 </style> | 
|  33 <div class="video"><span class="cue"><span>This is a <span>test subtitle</span><
    /span></span></div> |  33 <div class="video"><span class="cue"><span>This is a <span>test subtitle</span><
    /span></span></div> | 
| OLD | NEW |