Fix the rendering section to follow the new line and text positioning…

… and

position alignment approach.

webvtt.html

@@ -4104,7 +4104,7 @@ <h4>Processing model</h4>
     direction">vertical growing right</a>; let <var
     title="">writing-mode</var> be 'vertical-lr'.</p></li>
 
-    <li><p>Let <var title="">size</var> be <a>text track cue size</a>.</li>
+    <li><p>Let <var title="">size</var> be <a>text track cue size</a>.</p></li>
 
     <li><p>If the <a>text track cue writing direction</a> is
     <a title="text track cue horizontal writing
@@ -4124,94 +4124,150 @@ <h4>Processing model</h4>
 
      <dl class="switch">
 
-       <dt>If the <a>text track cue writing direction</a> is <a title="text track cue horizontal writing direction">horizontal</a>:</dt>
+       <dt>If the <a>text track cue writing direction</a> is
+       <a title="text track cue horizontal writing direction">horizontal</a>:</dt>
        <dd>
-        <p>Let <var title="">x-position</var> be the <a>text track cue text position</a>.</p>
+         <dl class="switch">
+           <dt>If the <a>text track cue text position alignment</a> is
+           <a title="text track cue text position start alignment">start alignment</a>:</dt>
+           <dd><p>Let <var title="">x-position</var> be the <a>text track cue text position</a>.</p></dd>
+
+           <dt>If the <a>text track cue text position alignment</a> is
+           <a title="text track cue text position middle alignment">middle alignment</a>:</dt>
+           <dd><p>Let <var title="">x-position</var> be the <a>text track cue text position</a> minus
+           half of <var title="">size</var>.</p></dd>
+
+           <dt>If the <a>text track cue text position alignment</a> is
+           <a title="text track cue text position end alignment">end alignment</a>:</dt>
+           <dd><p>Let <var title="">x-position</var> be the <a>text track cue text position</a> minus
+           <var title="">size</var>.</p></dd>
+         </dl>
        </dd>
 
-       <dt>If the <a>text track cue writing direction</a> is <a title="text track cue vertical growing left writing direction">vertical growing left</a> or <a title="text track cue vertical growing right writing direction">vertical growing right</a>:</dt>
+       <dt>If the <a>text track cue writing direction</a> is
+       <a title="text track cue vertical growing left writing direction">vertical growing left</a>
+       or <a title="text track cue vertical growing right writing direction">vertical growing right</a>:</dt>
        <dd>
-        <p>Let <var title="">y-position</var> be the <a>text track cue text position</a>.</p>
+         <dl class="switch">
+           <dt>If the <a>text track cue text position alignment</a> is
+           <a title="text track cue text position start alignment">start alignment</a>:</dt>
+           <dd><p>Let <var title="">y-position</var> be the <a>text track cue text position</a>.</p></dd>
+
+           <dt>If the <a>text track cue text position alignment</a> is
+           <a title="text track cue text position middle alignment">middle alignment</a>:</dt>
+           <dd><p>Let <var title="">y-position</var> be the <a>text track cue text position</a> minus
+           half of <var title="">size</var>.</p></dd>
+
+           <dt>If the <a>text track cue text position alignment</a> is
+           <a title="text track cue text position end alignment">end alignment</a>:</dt>
+           <dd><p>Let <var title="">y-position</var> be the <a>text track cue text position</a> minus
+           <var title="">size</var>.</p></dd>
+         </dl>
        </dd>
 
      </dl>
 
     </li>
 
     <li>
-
-      <p>If the <a>text track cue text alignment</a> is <a title="text track cue middle alignment">middle</a>,
-      adjust the value of <var title="">x-position</var> or <var title="">y-position</var> for
-      <var title="">cue</var> as per the appropriate rules from the following list:</p>
+
+      <p>Determine the value of whichever of <var title="">x-position</var> or <var title="">y-position</var>
+      is not yet calculated for <var title="">cue</var> as per the appropriate rules from the following list:</p>
 
       <dl class="switch">
 
-        <dt>If the <a>text track cue writing direction</a> is <a title="text track cue horizontal writing direction">horizontal</a>:</dt>
-        <dd>
-         <p>Let <var title="">x-position</var> be <var title="">x-position</var> minus half of <var title="">size</var>.</p>
-        </dd>
+      <dt>If the <a>text track cue snap-to-lines flag</a> is not set:</dt>
+      <dd>
+        <dl class="switch">
 
-        <dt>If the <a>text track cue writing direction</a> is <a title="text track cue vertical growing left writing direction">vertical growing left</a> or <a title="text track cue vertical growing right writing direction">vertical growing right</a>:</dt>
+        <dt>If the <a>text track cue writing direction</a> is
+        <a title="text track cue horizontal writing direction">horizontal</a>:</dt>
         <dd>
-         <p>Let <var title="">y-position</var> be <var title="">y-position</var> minus half of <var title="">size</var>.</p>
+          <dl class="switch">
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue line start alignment">start alignment</a>:</dt>
+            <dd><p>Let <var title="">y-position</var> be the <a>text track cue computed line position</a>.</p></dd>
+
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue text position middle alignment">middle alignment</a>:</dt>
+            <dd><p>Let <var title="">y-position</var> be the <a>text track cue computed line position</a> minus
+            half of the cue box height.</p></dd>
+
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue text position end alignment">end alignment</a>:</dt>
+            <dd><p>Let <var title="">y-position</var> be the <a>text track cue computed line position</a> minus
+            the cue box height.</p></dd>
+          </dl>
         </dd>
 
-      </dl>
-
-    </li>
-
-    <li>
-
-      <p>If the <a>text track cue text alignment</a> is <a title="text track cue end alignment">end</a>,
-      or <a title="text track cue right alignment">right</a> for a <var title="">direction</var> of 'ltr',
-      or <a title="text track cue start alignment">start</a> for a <var title="">direction</var> of 'rtl',
-      adjust the value of <var title="">x-position</var> or <var title="">y-position</var> for
-      <var title="">cue</var> as per the appropriate rules from the following list:</p>
-
-      <dl class="switch">
-
-        <dt>If the <a>text track cue writing direction</a> is <a title="text track cue horizontal writing direction">horizontal</a>:</dt>
+        <dt>If the <a>text track cue writing direction</a> is
+        <a title="text track cue vertical growing left writing direction">vertical growing left</a>:</dt>
         <dd>
-         <p>Let <var title="">x-position</var> be <var title="">x-position</var> minus <var title="">size</var>.</p>
+          <dl class="switch">
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue text position start alignment">start alignment</a>:</dt>
+            <dd><p>Let <var title="">x-position</var> be 100 minus the <a>text track cue computed line position</a>
+            minus the cue box width.</p></dd>
+
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue text position middle alignment">middle alignment</a>:</dt>
+            <dd><p>Let <var title="">x-position</var> be 100 minus the <a>text track cue computed line position</a>
+            minus half of the cue box width.</p></dd>
+
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue text position end alignment">end alignment</a>:</dt>
+            <dd><p>Let <var title="">x-position</var> be 100 minus the <a>text track cue computed line position</a>.</p>
+            </dd>
+          </dl>
         </dd>
 
-        <dt>If the <a>text track cue writing direction</a> is <a title="text track cue vertical growing left writing direction">vertical growing left</a> or <a title="text track cue vertical growing right writing direction">vertical growing right</a>:</dt>
+        <dt>If the <a>text track cue writing direction</a> is
+        <a title="text track cue vertical growing right writing direction">vertical growing right</a>:</dt>
         <dd>
-         <p>Let <var title="">y-position</var> be <var title="">y-position</var> minus <var title="">size</var>.</p>
+          <dl class="switch">
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue text position start alignment">start alignment</a>:</dt>
+            <dd><p>Let <var title="">x-position</var> be the <a>text track cue computed line position</a>.</p></dd>
+
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue text position middle alignment">middle alignment</a>:</dt>
+            <dd><p>Let <var title="">x-position</var> be the <a>text track cue computed line position</a> plus
+            half of the cue box width.</p></dd>
+
+            <dt>If the <a>text track cue line alignment</a> is
+            <a title="text track cue text position end alignment">end alignment</a>:</dt>
+            <dd><p>Let <var title="">x-position</var> be the <a>text track cue computed line position</a> plus
+            the cue box width.</p></dd>
+          </dl>
         </dd>
 
-      </dl>
-
-    </li>
-
-    <li>
-
-      <p>Convert <var title="">x-position</var> and <var title="">y-position</var> to CSS values
-      to be used by the next section to set CSS properties for the rendering as follows
-      ('vw' and 'vh' are CSS units <a href="#refsCSSVALUES">[CSSVALUES]</a>):</p>
+        </dl>
+      </dd>
 
-      <dl class="switch">
+      <dt>If the <a>text track cue snap-to-lines flag</a> is set:</dt>
+      <dd>
+        <dl class="switch">
 
-        <dt>If the <a>text track cue writing direction</a> is <a title="text track cue horizontal writing direction">horizontal</a>:</dt>
-        <dd>
-         <p>Let <var title="">left</var> be '<var title="">x-position</var>&#x2009;vw' and
-         <var title="">top</var> be '<var title="">y-position</var>&#x2009;vh'.</p>
+        <dt>If the <a>text track cue writing direction</a> is
+        <a title="text track cue horizontal writing direction">horizontal</a>:</dt>
+        <dd><p>Let <var title="">y-position</var> be 0.</p>
         </dd>
 
-        <dt>If the <a>text track cue writing direction</a> is <a title="text track cue vertical growing left writing direction">vertical growing left</a>:</dt>
-        <dd>
-         <p>Let <var title="">right</var> be '<var title="">x-position</var>&#x2009;vw' and
-         <var title="">top</var> be '<var title="">y-position</var>&#x2009;vh'.</p>
+        <dt>If the <a>text track cue writing direction</a> is
+        <a title="text track cue vertical growing left writing direction">vertical growing left</a> or
+        <a title="text track cue vertical growing right writing direction">vertical growing right</a>:</dt>
+        <dd><p>Let <var title="">x-position</var> be 0.</p>
         </dd>
 
-        <dt>If the <a>text track cue writing direction</a> is <a title="text track cue vertical growing right writing direction">vertical growing right</a>:</dt>
-        <dd>
-         <p>Let <var title="">left</var> be '<var title="">x-position</var>&#x2009;vw' and
-         <var title="">top</var> be '<var title="">y-position</var>&#x2009;vh'.</p>
-        </dd>
+        </dl>
+      </dd>
 
       </dl>
+    </li>
 
+    <li><p>Let <var title="">left</var> be '<var title="">x-position</var>&#x2009;vw' and <var title="">top</var>
+    be '<var title="">y-position</var>&#x2009;vh'. (These are CSS values used by the next section to set
+    CSS properties for the rendering; 'vw' and 'vh' are CSS units.) <a href="#refsCSSVALUES">[CSSVALUES]</a>.</p>
     </li>
 
     <li>