CSS: How to increase the size of a OSX submit button

Question

How do I increase the native FORM submit button size for OSX-Safari?

I want to keep the native look of a FORM submit button for it's respective operating system while also enlarging the size of the submit button. (Meaning, no use of images, custom borders etc..)

Using the following CSS:

input.submitbutton {font-size:150%;}

On Windows, this increase the submit button size height and width as desired ... regardless of the browser (Safari, Firefox, IE, Chrome).

But on OSX - Safari does not increase the button size at all. The form button size remains the default size.

Answer 1

Try to include this CSS property on your style:

-webkit-appearance: button;

Hope this helps!

Answer 2

Safari's form buttons are notoriously hard to style (if not impossible).

As others have said, height is pretty much untouchable.

What you can do is set the font size to an exact pixel size to resize the button.

input.submitbutton {font-size:14px;}

That should make the font size larger and the button as well. It does max out though...you can't just keep increasing the font size.