title: Adjust image size based on the font size
body: <p>I am putting together an HTML page to be viewed in both mobile phones and PC/Mac. In the text, I sometimes have inline images:</p>
  
  <pre><code>&lt;p&gt;to do that, then press on button &lt;img src="button.png" /&gt; for 2 seconds&lt;/p&gt;
  </code></pre>
  
  <p>My fonts are sized in em or % so it is readable on both low res-phones and high-res phones. The issue is that my buttons (usually 32px high images) appear so tiny on high-res phones.</p>
  
  <p>How do I adjust the image size? Preferably pure CSS, but JS is still OK.</p>