Issues with style....

[aemillerco 0]

I recently posted this over on the Gravity Forms site, but I think it needs to be posted here as well: Hey guys... I am having a heck of a lot of trouble with a form that includes an "address" group of fields. I am no CSS expert so I am using stylebot for google chrome to modify the look of the form fields, and then I dump the generated CSS into the code area of my WP theme (PlatformPro). Look at the "state" field though. It's got a green background! I cannot figure it out. http://www.customseedpacks.com/order/ The only difference i see is that this field takes on a format of: #input_2_4.4 while others are #input_2_4_5 (underscore vs a period). I am at a total loss and going nuts over this. Any help would be GREATLY appreciated! Thanks!

[aemillerco 0]

This was their response over @ Gravity Forms:

The background color is coming from a rule on line 88 of the dynamic.css file. http://www.customseedpacks.com/wp-content/uploads/pagelines/dynamic.css?ver=135-06141151959 Here's the rule.. it applys a green background color to all of these elements.. including a blanket application to all inputs, textareas, etc... pretty sloppy CSS. The best thing to do is to edit this file and remove the input & textarea references or you'll probably encounter this again somewhere else. It appears that you've overriden that blanket style with some other rules for the rest of your form. It's best to just nix it at the source than try to override it with more CSS unless you absolutely have to.

It appears as though you guys both love to sling mud at each other, but this time it seems as though Pagelines is to blame for the sloppy CSS. I am having a heck of a time with the theme because of issues like this and it's getting VERY frustrating!

[Kate 3]

Hi Chris, That line is actually coming from a line that's generated by the user. (I'm assuming that's you, unless you have someone else working on the site too.) Anything below the line

/* Custom CSS */

is generated by Settings->Custom Code->Custom CSS. So, you'll have to go into that area to make the modifications. Hope that helps!

[aemillerco 0]

Hmm this is all I have in the custom CSS. Certainly no green text input areas? ` body{} .entry_content img { max-width: 100%; } #branding .content-pad { padding: 20px 0px 15px; } #sidebar-wrap {margin-top: 26px;} span.gform_description { font-family: Palatino, "Palatino Linotype", serif; } div.gform_body { font-family: "Lucida Grande", Verdana, sans-serif; font-size: 15px; font-weight: bold; font-style: normal; } input.medium { background-color: #FFFFFF; } textarea.textarea.medium { background-color: #FFFFFF; } input.button.gform_button { height: 60px; width: 100px; margin-left: 28px; border-color: #49ad54; } span.date.time.published { color: #2c9e43; } span.post-comments a { color: #2c9e43; } span.fn a { color: #2c9e43; } span.date.time.published { color: #2c9e43; } span.post-comments a { color: #2c9e43; } span.fn a { color: #2c9e43; } #input_2_4_1 { background-color: #FFFFFF; } #input_2_4_2 { background-color: #FFFFFF; } #input_2_4_3 { background-color: #FFFFFF; } #input_2_4_5 { background-color: #FFFFFF; } #input_2_4.4 { background-color: #FFFFFF !important; } `

[aemillerco 0]

You can see all of my attempts at the bottom of the CSS to mask the green fields and make them white. It just wont work on the ONE field.

[cmunns 16]

It would work if you changed the last rule there to ` #input_2_4_4 input { background-color: #FFFFFF !important; } `

[aemillerco 0]

Actually, Adam - that does not do it. I thought it would too. Plus stylebot tells me that one element is named differently than all the others, thus the period instead of underscore on that one field.

[kastelic 6]

You could try:

.ginput_container input {background-color: white !important}

to target all the input fields in that container.

[aemillerco 0]

Thanks, Jimmy! That worked. I was beginning to think I bought into yet ANOTHER junky theme that was pushed on me by affiliate marketers. Maybe I can make this thing work - although the occasional update would be nice.

[aemillerco 0]

Still battling with conflicting CSS using this theme. It doesnt seem to play well with anything.

[catrina 103]

What issues are you having?

[aemillerco 0]

Just overall CSS formatting. We've gone round and round about this before. Change one color in the CP and 15 things change. Background colors are tied to form field colors and all sorts of nonsense. I have been trying to make gravity forms look good on several platform pro sites for weeks. I am terrible with CSS, and often times I have to target every single field just to change things like color, background color, input font size, etc. Making a gravity form look good (or even like it belongs on the site) in platform pro seems nearly impossible. Gravity suggests that Pagelines CSS is a complete mess and that I should go into dynamic.css and remove a bunch of stuff if I ever want things to look right. Their exact words were that pagelines has some "pretty sloppy css" Very, very frustrating - especially for someone who knows very little about css.

[cmunns 16]

The goal of the dynamic CSS is for rapid development of color schemes for people that are not going to code ANYTHING. Of course this is problematic for development and the removal/improvement of the css is slated for future releases. In general, however, you just need to take the outermost div of your gravity forms container and use that in your selector instead of each individual input id. .gform_wrapper input{}...something like that...but obviously making sure it overrides necessary specificty and hierarchy of the dynamic css file

[aemillerco 0]

Thanks cmunns - the .gform_wrapper worked. A little tweaking with padding & margins on another part & we got it fixed up.

[Rob 547]

If this matter is resolved, may I close this issue for you?