title: Audio captions with HTML5 <audio> element
body: <p>I would like to have the transcription of an audio file to be shown as the audio plays. I've tried several options to no avail:</p>
  
  <p><code>&lt;audio src="../audio/myaudio.mp3" controls&gt;
  &lt;track default srclang="en" kind="captions" label="English subtitles" src="sub.vtt"/&gt;
  &lt;/audio&gt;</code></p>
  
  <p>The path to the .vtt file is correct. The <code>&lt;track&gt;</code> element is supposed to be child of both <code>&lt;video&gt;</code> and <code>&lt;audio&gt;</code> (see <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/track" rel="nofollow noreferrer">https://developer.mozilla.org/en-US/docs/Web/HTML/Element/track</a>). Why can't I display my captions?</p>
  
  <p>My .vtt file contains something like</p>
  
  <pre><code>WEBVTT FILE
  
  1
  00:00:03.500 --&gt; 00:00:05.000
  D:vertical A:start First line
  
  2
  00:00:06.000 --&gt; 00:00:09.000
  A:start second line
  </code></pre>
  
  <p>etc...</p>
  
  <p>I've also tried by using the <code>&lt;video&gt;</code> element:</p>
  
  <pre><code>&lt;video style="background: black; width:360px; height:260px;" src="../audio/mayaudio.mp3" controls&gt;
  &lt;track default srclang="en" kind="subtitles" label="English subtitles" src="sub.vtt"/&gt;
  &lt;/video&gt;
  </code></pre>
  
  <p>Still no luck. I can see the 'CC' button and I can also select the Elnglish subtitles item. The audio plays (even if I use the <code>&lt;video&gt;</code> element) and I can't see any caption. Swapping 'captions' with 'subtitles' doesn't help.</p>