title: Vertical aligning an image next to a textbox doesn't work in Chrome or Safari
body: <p>I'm trying to align an image link next to a textbox. Here's my markup:</p>
  
  <pre><code>&lt;div style="height: 18px; overflow: hidden; padding: 5px 6px 6px 5px; width: 207px; background-color: #21235C"&gt;
      &lt;input id="search" type="text" name="search" style="height: 18px; padding: 0; width: 182px; border: none;" /&gt;
      &lt;a style="vertical-align: top;" href="#"&gt;
          &lt;img src="http://i.imgur.com/0UZyz.png" alt="search" /&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This works fine in FF and IE. The image aligns correctly next to the textbox. But in Chrome and Safari, the textbox is pushed down.</p>
  
  <p>Here it is in jsFiddle: <a href="http://jsfiddle.net/tQUyW/" rel="nofollow">http://jsfiddle.net/tQUyW/</a></p>
  
  <p>Any way to fix that?</p>