Question

If I want to make my own clickable buttons, I can do this:

<a href="javascript:;" class="button">Sign up</a>

Where CSS rules for a.button causes the link to be shown as a button. If I apply the same trick to <input type="submit" />, I get the button image but it is shown on top of the default submit button and the cursor doesn’t change to a hand like it does on <a> tags.

How can I fix this behavior?

Answer 1

You can use appropriate CSS properties such as

border: none;
background: transparent;
cursor: pointer;

to remove the default styles from your input type="submit" button.