I'm currently in css form hell on my website. I'd like to skin the submit button and the cancel link so they look the same.

I tried to use two buttons to make it easier but since their behavior is very different, it makes sense to use two different tags, and i get some nice "no surprises" side-effects.

So far, though, it has been a process fraught with disappointment and bitter failure; i tried to get both tags to play nicely one next to the other but all my css attempts are a waste of time. Either the link jumps up by a few pixels, or the submit button has its content slightly but noticeably lower, etc, etc...

Is there a way to skin both tags with the same appearance?

  • There are good reasons not to use buttons for links, but I'm not sure the fact that two interface elements have different behaviors means they need to use different tags. What tags you use makes no difference to the user. That would be a better argument for not making the submit and cancel elements look the same. – Lèse majesté Dec 15 '10 at 13:49
  • As per the FAQ this question belongs on Doctype – John Conde Dec 15 '10 at 14:18
  • Doctype? I guess it's one of the Area 51 sites, i don't see it in the list. I also thought that questions could be migrated, is it possible, or should i copy/paste it? – samy Dec 16 '10 at 7:51

I would style the button following something like this tutorial (no JavaScript, no links instead of buttons, works in IE6 through IE8), and then style the link accordingly (which is usually pretty straightforward as opposed to styling buttons).

Not the answer you're looking for? Browse other questions tagged or ask your own question.