Richard,
Your issue is coming from the default canvas stylesheet. Line 547 of the /canvas/style.css file sets a blanket padding rule to all Gravity Forms inputs.
[css]
.gform_wrapper input { padding: 7px 3px !important; }
Since the radio/checkboxes are inputs as well, they inherit this padding so it's throwing the heights off and causing the staggered layout in IE. Since they specified the rule is !important, you'l probably have to use the important declaration on the properties I sent previously.
[css]
body .gform_wrapper input[type=radio],
body .gform_wrapper input[type=checkbox]{
padding-top:0!important;
padding-bottom:0!important;
border-top:none;
border-right:none;
border-bottom:none;
border-left:none
}
Any time a theme applies blanket margin/padding rules to inputs it's going to throw off the layout for the list items. It's a shortcut that way too many theme developers take and a common problem.
The proper way to do this would be target the inputs by their specific types to apply the properties.. example below:
[css]
input[type=text],
input[type=tel],
input[type=url],
input[type=number],
input[type=file],
input[type=password] {padding:7px 3px}
Posted 13 years ago on Monday April 18, 2011 |
Permalink