Coolguy
Coolguy

Reputation: 2285

Background image for button in IE6 html

The below coding is how I add a background image on a button on my webpage. It can work on IE9, Firefox and Chrome:

   <td>
   <input id="btn1" style="width: 25px; height: 25px; background-image: url('images/refresh.png'); background-repeat: no-repeat;" type="button" onclick="Get()"/>  
   </td>

But when I use IE6, it does not show the image. Just an empty button.

Do you guys know how do we put the image on a button that will shown on IE9 as well as IE6?

Upvotes: 0

Views: 147

Answers (2)

starkbr
starkbr

Reputation: 229

You can use <input type="image" src="">. It works fine with IE and others browsers.

This is the W3C Recommendation:

"The image button state represents either an image from which a user can select a coordinate and submit the form, or alternatively a button from which the user can submit the form. The element is a button, specifically a submit button."

Or you can use this hack (I mean, it's preferable using the input image.):

<div class="button"><input type="submit" name="" value=""></div>

And the CSS file:

div.button input {
    background:url(/images/Btn.PNG) no-repeat;
    cursor:pointer;
    width: 200px;
    height: 100px;
    border: none;
}

Source of the last recommendation is: Stack Overflow :)

Upvotes: 0

&#222;aw
&#222;aw

Reputation: 2057

you could use <input type='image'> It defines an image as the submit button.

Upvotes: 1

Related Questions