title: Input CSS showing border in Chrome, Safari and Internet Explorer and no text
body: <p>I'm using this input</p>
  
  <pre><code>&lt;input src="img/buttons1.png" name="submit" class="submit1" type="image" value="See Today's Date Deal" tabindex="502" /&gt;
  </code></pre>
  
  <p>and here it's the css</p>
  
  <pre><code>.submit1 {
                display: block;
                width: 250px;
                height: 28px;
                background: url(img/buttons1.png) no-repeat 0 0;
                padding-top: 12px;
                text-align: center;
                font-size: 17px !important;
                color:#fff; 
                border:0;
                outline:none;
  }
  </code></pre>
  
  <p>In Firefox looks great but in Chrome, Safari and Internet Explorer it is <img src="https://i.stack.imgur.com/Tu3U1.png" alt="http://screencast.com/t/PsWmBZA8J"> <br>
  I'd like to remove border and show text.</p>
  
  <p>Any suggestion would be great! Thanks</p>