I have the following form, where the padding between the fields looks fine in FireFox, but in IE 7, there much more space in between the fields. How can I fix it so that it looks good in both? If I change the padding-bottom of .contactform p to anything less than 15px, in FireFox, the fields are bunched up against each other. Below is the css for the form:
[code]
.contactform {width:635px; margin:2.0em 0 0 0; padding:10px 10px 0 10px; border:solid 1px rgb(200,200,200); background-color:rgb(240,240,240);}
.contactform fieldset {padding:20px 0 5px 0 !important /*Non-IE6*/; padding:0 /*IE6*/; margin:0 10px 20px 0; border:solid 1px rgb(220,220,220);}
.contactform fieldset legend {margin:0 0 0 5px !important /*Non-IE*/; margin:0 0 20px 5px /*IE6*/; padding:0 2px 0 2px; color:rgb(80,80,80); font-weight:bold; font-size:130%;}
.contactform label.left {float:left; width:205px; margin:0px 0px 0px 0px; padding:2px; font-size:110%; text-align:right;}
.contactform select.combo {float: left; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%; white-space:nowrap;}
.contactform input.field {float:left; width:275px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactform input.date {float: left; width:100px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactform textarea {width:275px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactform textarea.html {width:610px; margin: 0px 0px 0px 0px; padding:0px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;}
.contactform input.button {float:right; width:auto; margin:10px 141px 0px 0px; padding:1px !important /*Non-IE6*/; padding:0 /*IE6*/; background:rgb(230,230,230); border:solid 1px rgb(150,150,150); text-align:center; font-family:verdana,arial,sans-serif; color:rgb(150,150,150); font-size:110%;}
.contactform input.button:hover {cursor: pointer; border:solid 1px rgb(80,80,80); background:rgb(220,220,220); color:rgb(80,80,80);}
/*.main .contactform img {float:none; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 5px; position: absolute; border-style:none;}*/
.main .contactform img {border-style:none; margin: 0; padding: 0; position: absolute;}
/*.main .contactform a {float:left; padding: 0; margin-left: 5px;}*/
/*.main .contactform a img {float:none; padding: 0; margin: 0; position: absolute; border-style:none;}*/
.main .contactform a img:hover { border-style: none;}
.contactform-clear {clear:both; width:610px; height:0.1em; border:none; background:rgb(210,210,210);}
.contactform img.switch {margin:3px 5px 0px 213px; border:solid 1px rgb(150,150,150); position: relative;}
.contactform p {width: 100%; padding-bottom: 15px;}
Here is the link [URL]http://www.zluth.org/contact_us/
Thanks!