How to change input button image using CSS?
- by Baltimark
So, I can create an input button with an image using
<INPUT type="image" src="/images/Btn.PNG" value="">
But, I can't get the same behavior using CSS. for instance, i've tried
<INPUT type="image" class="myButton" value="">
where "myButton" is defined in the css file as
.myButton{
background:url(/images/Btn.PNG) no-repeat;
cursor:pointer;
width: 200px;
height: 100px;
border: none;
}
If that's all I wanted to do, I could use the original style, but I want to change the button's appearance on hover (using a myButton:hover class). I know the links are good because I've been able to load them for a background image for other parts of the page (just as a check). I found examples on the web of how to do it using javascript, but I'm looking for a css solution.
I'm using Firefox 3.0.3 if that makes a difference.
Thanks
