0

I need to create both link and submit button - they should have identical look and they should be aligned properly.

Html:

<input class="foo" type="submit" value="I'm submit">
<br />
<a class="foo" href="">I'm link</a>

CSS:

.foo {
border: 0px;
margin: 0px;
padding: 0px;
font-family: Verdana;
font-size: 12px;
font-weight: bold;
background: none;
color: blue;
text-decoration: none;
cursor: pointer;
}

Jsfiddle: http://jsfiddle.net/BB6tN/1/

They look great in Chrome, but they are misaligned by couple of pixels in Firefox (haven't tested it on other browsers yet). Any suggestions, how to fix that or achieve similar result? Here is one solution: http://jsfiddle.net/hf66g/ but I would like to keep things simple and standard.

user1702401
  • 1,658
  • 16
  • 17

1 Answers1

2

Try this:

input::-moz-focus-inner { border:0; padding:0 }

Fiddle: http://jsfiddle.net/BB6tN/2/

Joran Den Houting
  • 3,149
  • 3
  • 21
  • 51