Many newer web browsers are starting to ignore the CSS directives related to buttons on web page forms. While this does lead to a more consistent look and feel on the desktop, ignoring the CSS and create system-type buttons can really mess up the look of a web page that is trying to create a consistent them.

As a result of this, many web designers are doing away with buttons on their forms altogether. Instead they use links (hrefs) inside of a div or a span element and they then style the div or span element to look like a button. This way the form will look consistent across all browsers.

The one problem with this approach is that if there are no buttons for the form, the user can no longer press the Enter key on the keyboard to submit the form. A lot of people don't like this since they then have to go from the keyboard to the mouse to submit the form.

If you are running into this problem on your web pages, there is a nice little fix you can use that will allow you to control the look of the buttons while keeping the form submission via the Enter key working. You can do this by adding a simple button of type submit to your form and then styling the button so that it is not visible. It won't affect your look at all. And since the browser thinks that there is a submit button in the form, hitting the Enter key will still work. Here's some code snippets as to how this looks...

...

<style type="text/css">
   button.hiddenSubmit {
      visibility: hidden;
   }
</style>

...

<form ...>

...

   <button type="submit" class="hiddenSubmit"></button>

...

</form>

...

Doing this will allow you to fully control the style of your buttons while leaving the page so that the user can hit the Enter key to submit the form.