title: mobile safari renders white space for html audio tag
body: <p>Unlike desktop browsers, mobile Safari adds white space for the audio tag when it renders html in the iPhone and iPad.  Why is this? Is there a way to avoid the behavior without an unnecessary style setting?  </p>
  
  <p>My goal is to allow a site visitor to play a short audio excerpt.  Introductory text and play / pause buttons must display on one line with single spacing between elements.  The code works fine in desktop browsers, but Mobile Safari (tested on iPhone 4S and iPad 3) adds white space (equivalent to ~30 characters) where the audio tag appears in the html file.  </p>
  
  <p>I isolated the problem, and found a workaround.  Here is a description of the situation, and three test pages that take you through the progression.  The last test file gives the workaround.  View each file in a desktop browser and an iPhone/iPad to see the behavior (and the source code).</p>
  
  <p>Space appears between introductory text and buttons - audiotest3<br>
  Move audio tag before the text and buttons, which makes a new line - audiotest4<br>
  Style the container that holds text and buttons with a negative top margin - audiotest5<br>
  ANSWER: Change audio style to height: 0 and width: 0 - audiotest6</p>
  
  <p><a href="http://www.trunorth.com/abug/audiobug.html" rel="nofollow">Click here for the test files</a>.</p>
  
  <p>Is this a known bug, or should I use a different markup?<br>
  <em>Different markup it is.  See ANSWER above.</em></p>