Submit Buttons With CSS (image button /hover)

HTML

<form action="">
<fieldset>
<legend>My awesome form</legend>
<label>Name: </label> <input type="text" class="input" />
<label>Password: </label> <input type="password" class="input" />
<label>&nbsp; </label> <input type="submit" value="Submit" class="button" /> <input type="submit" value="Cancel" class="button" />
</fieldset>
</form>


CSS

.input {
border: 1px solid #006;
background: #ffc;
}
.input:hover {
border: 1px solid #f00;
background: #ff6;
}

.button {
border: none;
/* background: url('link.png') no-repeat top left;*/
background-color:#dfdddd;
font-family:Arial;
font-size:12px;
font-weight:bold;
border:1px solid gray;
padding: 2px 8px;
}

.button:hover {
 border: none;
/* background: url('link-hover.png') no-repeat top left;*/
background-color:#c2c1c1;
font-family:Arial;
font-size:12px;
font-weight:bold;
border:1px solid gray;
padding: 2px 8px;
}

label {
display: block;
width: 150px;
float: left;
margin: 2px 4px 6px 4px;
text-align: right;
}
br { clear: left; }