Padding Not Working - IE, Firefox « Gravity Support Forums

Gravity Support Forums » Plugin Support » Gravity Forms

See my form here: http://www.agilebts.com/zoho-crm-test/

The 10px padding I have in from the background image is not working in IE and Firefox. It does work however in Chrome and Safari. Here is my code:

body .gform_wrapper form .gform_body ul,
body .gform_wrapper form .gform_body ul li {

	list-style-type: none !important;
	list-style-image: none !important;
	list-style: none !important;
	background-image: none !important;
	background: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important
}

body .gform_wrapper form {
     background: url('http://www.agilebts.com/wp-content/uploads/2013/01/Green-Form.png');
');
    padding: 10px;
      border:0px solid #cccccc;
border-radius: 10px;

        box-shadow:  3px 3px 5px 1px rgba(100, 100, 100, .7);

}

/* make the form container relative for positioning */

body .gform_wrapper {
    position: relative;
}

/* resize and position the form footer with the button */

body .gform_wrapper .gform_footer {
    width: auto;
    position: relative;
    top: 15px;
    left: 0px;
    padding: 0;
    margin: 0;
}

.gform_wrapper .gform_body .gform_fields .gfield label {color: #FFFFFF}

Paul

Posted 11 years ago on Friday March 1, 2013 | Permalink

David Peralty

Try putting the !important declaration on it as well and see if that works any better.

Posted 11 years ago on Friday March 1, 2013 | Permalink

timedriven
Member

Thanks for your reply! I tried adding that here but I didn't see a change:

body .gform_wrapper form {
     background: url('http://www.agilebts.com/wp-content/uploads/2013/01/Green-Form.png');
');
    padding: 10px !important;
      border:0px solid #cccccc;
border-radius: 10px;

        box-shadow:  3px 3px 5px 1px rgba(100, 100, 100, .7);

}

Posted 11 years ago on Friday March 1, 2013 | Permalink

David Peralty

I'll have to point out this to our CSS expert, I'm not sure why it isn't showing correctly.

Posted 11 years ago on Friday March 1, 2013 | Permalink
Richard Vav
Administrator
You need to check your style sheet as the w3c CSS validator is reporting 55 errors.

http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.agilebts.com%2Fwp-content%2Fthemes%2Fnevada%2Fstyle.css&profile=css3&usermedium=all&warning=1&vextwarning=&lang=en

However in this particular case I think the problem lies with stray code on line 3 of the css shown below, try deleting that line and then test it again in firefox and ie
```
body .gform_wrapper form {
     background: url('http://www.agilebts.com/wp-content/uploads/2013/01/Green-Form.png');
');
    padding: 10px !important;
      border:0px solid #cccccc;
border-radius: 10px;

        box-shadow:  3px 3px 5px 1px rgba(100, 100, 100, .7);

}
```
Posted 11 years ago on Friday March 1, 2013 | Permalink
timedriven
Member

OK I removed that stray code on line 3 and it fixed the problem. Thank you very much!

Posted 11 years ago on Friday March 1, 2013 | Permalink
Richard Vav
Administrator

Your welcome, small CSS errors normally aren't an issue but as you just experienced each browser takes a different approach to handling them, and it usually is ie that takes the harder line.

Posted 11 years ago on Friday March 1, 2013 | Permalink

This topic has been resolved and has been closed to new replies.