Using a .jpg graphic for an input button

Changing button on button input type

[Adam5000]

The code below works good, and if it's not a big issue, I'd like to put a fancier looking button on it. Something like start_button.jpg Help!

<div id="start"><input type="button" onClick="startClock();" value="Start"></div>

[lavazza]

try this:
<!-- insert into the head section -->
<style type="text/css">
.myStartButton{
border-top:0px groove #000000;
border-bottom:0px groove #333333;
border-left:0px groove #cccccc;
border-right:0px groove #333333;
color:#cccccc;
background:#ffffff;
}
</style>
<!-- /insert into the head section -->
<!-- insert into the body section -->

<a class="myClass"
title="Click me to START">
<button type="button"
id="btnStart"
name="btnStart"
class="myStartButton"
onClick="startClock();">
<imgsrc="images/start_button.jpg"
height="50px;"
width="150px;"
alt="img: start button">
</button>
</a>
<!-- /insert into the body section -->

[Marshall]

Wouldn't this be easier:

<input type="image" src="start.jpg" alt="Start Clock" title="Start Clock" width="whatever" height="whatever" onClick="startClock();" />

Just a thought.
Marshall

[Adam5000]

Lava. I'm sure yours works good and Marshal's is a little easier to work with.

Marshal. I tried it out and it works great.

Thanks to both of you.

[lavazza]

Wouldn't this be easier:

Yep... but it isn't valid html