Jump to content


Photo

Issues with style....


  • Please log in to reply
14 replies to this topic

#1 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 15 June 2011 - 03:22 AM

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!

#2 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 15 June 2011 - 03:23 AM

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.customsee...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!

#3 Kate

Kate

    Advocate

  • Members
  • 3039 posts

Posted 15 June 2011 - 01:35 PM

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!

#4 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 15 June 2011 - 05:09 PM

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; } `

#5 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 15 June 2011 - 05:09 PM

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. :(

#6 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts
  • Country: Country Flag

Posted 15 June 2011 - 08:18 PM

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

#7 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 15 June 2011 - 08:29 PM

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.

#8 kastelic

kastelic

    Advocate

  • Members

  • 3081 posts
  • Country: Country Flag

Posted 15 June 2011 - 09:34 PM

You could try:

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

to target all the input fields in that container.

#9 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 21 June 2011 - 02:04 AM

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. :)

#10 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 30 June 2011 - 01:41 AM

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

#11 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 30 June 2011 - 03:07 AM

What issues are you having?

#12 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 30 June 2011 - 03:15 AM

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. :(

#13 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts
  • Country: Country Flag

Posted 30 June 2011 - 08:51 PM

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

#14 aemillerco

aemillerco

    Advanced Member

  • Members
  • PipPipPip
  • 94 posts

Posted 27 August 2011 - 04:41 AM

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

#15 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 27 August 2011 - 06:44 AM

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