title: input type search border-radius issue in Google Chrome
body: <p>I have an <code>&lt;input type="search"/&gt;</code> element (no other HTML).</p>
  
  <p>Here's the CSS:</p>
  
  <pre><code>input[type=search] {
      border: 1px solid #000;
      padding: 4px 12px;
      border-radius: 8px;
  }
  </code></pre>
  
  <p>In Firefox 7 it looks great:</p>
  
  <p><img src="https://i.stack.imgur.com/1X8J9.png" alt="Rounded corners on input element in Firefox 7"></p>
  
  <p>However, in Chrome 15 the rounded corners are cut off:</p>
  
  <p><img src="https://i.stack.imgur.com/NnzEw.png" alt="enter image description here"></p>
  
  <p><a href="http://jsfiddle.net/Ys9pw/" rel="nofollow noreferrer">View jsFiddle</a></p>
  
  <p>Any way I can fix this?</p>