title: jQuery Mobile - how to get search icon on the search bar?
body: <p>I'm trying to implement a search bar 
  <br>But i was <strong>not</strong> able to display the search icon on the search bar. <br>
  Here is the <a href="http://jsfiddle.net/cWUfu/" rel="nofollow">code (jsfiddle)</a>.
  I found the default style overrides my custom style.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="search_controls"&gt;
      &lt;input type="text" class="search-box" placeholder="e.g. restaurant name, cuisine" /&gt;
  &lt;/div&gt;
  
  input.ui-input-text, textarea.ui-input-text {
  background-image: none;
  padding: .4em;
  margin: .5em 0;
  line-height: 1.4;
  font-size: 16px;
  display: block;
  width: 100%;
  outline: 0;
  }
  </code></pre>
  
  <p>CUSTOM STYLE</p>
  
  <pre><code>#search_controls + input.ui-input-text{
      background: url('../img/search_icon.png') 98% center no-repeat!important;
      height: 26px;
      padding: .4em;
      margin: .5em;
      font-size: 15px;
      display: block;
      width: 99%!important;
      outline: 0;
  }
  </code></pre>
  
  <p>How to address this issue?</p>