Here is the code I've been working on:
HTML:
<!DOCTYPE html>
...
<form>
<input type="image" value=" " class="btnimage" />
</form>
...
CSS:
.btnimage {
width: 80px;
height: 25px;
background:url('C:/Users/John/Desktop/Misc Things for the CoD Ghosts Site/SubmitButton.png');
}
.btnimage:hover {
background-position: 0 -25px;
background:url('C:/Users/John/Desktop/Misc Things for the CoD Ghosts Site/SubmitButtononHover.png');
}
Although the code is functioning, there's a persistent border around the button that I'm trying to remove. Adding background-border:0; to both classes did not achieve the desired result.