Imagine a form to add items to a shopping cart which sits in a background image lozenge. When the submit button is an image the display breaks. The image itself sits neatly in the background lozenge, but the <select> form elements suddenly develop a top margin of about 8 pixels. The problem still exists when this identical code is isolated in its own page. I've tried all sorts of margins (including negative ones) on the button and the <select> - I've also tried cheating by adding blank space to the button image and the background lozenge image. No matter *what* I do I just cannot get the button image to be independent of the <select> form items (or vice versa). Looks identical in IE8 and Firefox 3.
The image used for the submit button is going to display at actual size. this is probably affecting your other form elements. Remember, they are all in the same container. If the submit button image is too to tall, you are going to get what looks like margin-top; - when what it really is, is the extra height of the image pushing the roof up.
Test this by adding an inline style to the submit button. You may need to jigger vertical-align: as well.