title: Changing input background for Chrome autocomplete
body: <p>I have a specific background that uses an image but chrome messes it up. I know there's a way to change the color but I want to actually change the background, but how?</p>
  
  <p>Normally it's like this</p>
  
  <p>:<img src="https://i.stack.imgur.com/LDOKQ.png" alt="This is how it is normal"></p>
  
  <p>But then with the autocomplete of chrome gets like this</p>
  
  <p><img src="https://i.stack.imgur.com/eDTqP.png" alt="This is how it is with the autocomplete"></p>
  
  <p>I have this css code for it</p>
  
  <pre><code>#email-field:-webkit-autofill,
  #pass-field:-webkit-autofill {
      -webkit-box-shadow: 0 0 0px 1000px white inset;
       background:#fff url(../../img/site/username.png) no-repeat 12px center;         
  }
  </code></pre>
  
  <p>The background immage still won't show up. The background is white and I've tried putting the "background:#fff....." before the "-webkit-box" but still didn't work.
  The html code is, in laravel: </p>
  
  <pre><code>   &lt;li&gt;{{ Form::email('email', '', array('placeholder' =&gt; 'E-mail')) }}&lt;/li&gt;
     &lt;li&gt;{{ Form::password('password', array('placeholder' =&gt; 'Password')) }}&lt;/li&gt;
  </code></pre>
  
  <p>So the question is, how do I override chrome's autocomplete background with that of mine? 
  background:#fff url(../../img/site/username.png) no-repeat 12px center</p>