Browser Compatibility: Form Fields

Form fields will vary across browsers, and there isn't really any way to get around it. Let's say you have a text field in IE6. The same text field will look almost twenty pixels wider in Netscape 4! Not only that, but using cascading style sheet styles for the form elements work in some browsers, but not all. For example, you can use cascading style sheets to change the colors of "submit" buttons so that they match your layout. But, Netscape 4.7 will display the same old grey submit button -- with a funny square of color below it.

In Internet Explorer	In Netscape 4.7

Webmonkey's article gives a good comparison of all the numbers, and we recommend that you take a look at it. For a quick summary:

Text input fields are widest in Netscape 4 for Windows.
Drop down menus are biggest in Netscape 6 for windows (height) and Netscape 6 for Macs (width).
Multi-select boxes are tallest in IE for Windows and widest for Netscape 6 for Macs.
Text areas are tallest in Netscape 4 for Windows and widest in Netscape 6 for Windows.
Radio buttons and checkboxes show no significant differences.
Submit buttons and other input buttons are tallest for IE in Windows and widest in Netscape 6 for Macs.

Summary

Form fields are a pain.