https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others Gravity Support Forums Topic: Styling Multiple Forms - Working for some styles not others? en-US Wed, 22 Apr 2026 14:43:42 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others#post-71652 Mon, 20 Aug 2012 00:03:07 +0000 Chris Hajer 71652@https://legacy.forums.gravityhelp.com/ <p>Continued <a href="http://www.gravityhelp.com/forums/topic/multiple-forms-on-one-site-wish-for-different-background-and-border-colors" rel="nofollow">here</a>. </p> https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others#post-71633 Sun, 19 Aug 2012 21:15:04 +0000 Chris Hajer 71633@https://legacy.forums.gravityhelp.com/ <p>In the future, it's probably best to start your own topic so we can address your issue individually.</p> <p>Can you explain <em>what</em> you want to be coral and what you want to be blue exactly? Background for the complete page, or the form, or the inputs?</p> <p>If adding a bracket changes your CSS like that, it's either invalid before you added it, or after, and the fact that the color changes is a side-effect of that error. </p> https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others#post-71623 Sun, 19 Aug 2012 15:32:59 +0000 GJudy 71623@https://legacy.forums.gravityhelp.com/ <p>I have an issue going on with this suggestion for the form specific code. I want it to work so bad, but I can't get it. Trying this line from the pastie above. /*-- Form ID 1 specific styles ---------------------------------------------*/</p> <p>Using StudioPress Education child theme and Premise landing page.<br /> The sandbox website is <a href="http://sensiblestrategy.com" rel="nofollow">http://sensiblestrategy.com</a> and the pages are <a href="http://sensiblestrategy.com/landing/nonsense/" rel="nofollow">http://sensiblestrategy.com/landing/nonsense/</a> (premise landing page) and<br /> <a href="http://sensiblestrategy.com/stealth-nonsense/" rel="nofollow">http://sensiblestrategy.com/stealth-nonsense/</a></p> <p>The code is in a custom css. </p> <p>if it works, the one at nonsense would have a coral background (form ID 1) and the one at stealth-nonsense would be blue background. (form ID 4)</p> <p>I have an extra { in the custom css to make them coral; if i remove that they are blue. I wanted them to be one coral and one blue.</p> <p>I hope it is okay to bump this topic as opposed to starting a new one. Thank you. </p> https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others#post-8348 Mon, 09 Aug 2010 10:32:21 +0000 Kevin Flahaut 8348@https://legacy.forums.gravityhelp.com/ <p>Adam, here's what I found. You put your custom rules before the default rules in the CSS and the default rules were overriding the new ones.</p> <p>You need to put any custom rules below the default forms CSS in the stylesheet so it renders the last rules read.</p> <p><a href="http://pastie.org/1081799" rel="nofollow">http://pastie.org/1081799</a> </p> https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others#post-8306 Fri, 06 Aug 2010 16:58:55 +0000 Kevin Flahaut 8306@https://legacy.forums.gravityhelp.com/ <p>Adam,</p> <p>You can email me directly at kevin at rocketgenius.com and I'll check it out. Please include a link back to this thread for reference. </p> https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others#post-8290 Fri, 06 Aug 2010 13:12:01 +0000 awarner20 8290@https://legacy.forums.gravityhelp.com/ <p>Hi Kevin,</p> <p>I can't show the form publicly as it's for my employer's members only content (pricelists, etc). Is it possible to contact me through my registered GF email so I can share the link with you?</p> <p>To answer your questions:</p> <p>Yes, I've copied the entire form.css to my theme's stylesheet and am making my edits there.<br /> Yes, the "output css" option is set to "no".</p> <p>Thanks for any additional assistance you can provide.</p> <p>Adam </p> https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others#post-8282 Fri, 06 Aug 2010 11:43:22 +0000 Kevin Flahaut 8282@https://legacy.forums.gravityhelp.com/ <p>It's difficult to tell what's going on without being able to see your form. It could be that another rule is overriding yours somewhere. If you can post a URL to your form page, we'll be happy to look at it further.</p> <p>As far as adding the form ID to everything, If you did that, then it the rules wouldn't apply to any other forms, only the form ID you specified. I wouldn't recommend it.</p> <p>Are you making these changes in the forms.css file or adding styles to your theme stylesheet? We recommend that you do NOT make changes to the default forms stylesheet in the plugin folder as that will be overwritten when you run the automatic updates and you'll loose your custom css.</p> <p>You should add any new rules to your theme's style sheet. If you need to make extensive changes, it's best to copy the entire contents of the forms.css file and append that to your theme stylesheet. Then you can go into the forms settings and change the "output css" option to "no". From there, you can style your heart out and won't have to worry about updates overwriting your changes. </p> https://legacy.forums.gravityhelp.com/topic/styling-multiple-forms-working-for-some-styles-not-others#post-8279 Fri, 06 Aug 2010 10:34:24 +0000 awarner20 8279@https://legacy.forums.gravityhelp.com/ <p>Hi all,</p> <p>I've got 5 different forms on one install and I've been trying to style them independently. I've been searching the forums and it looks like I just need to specify the form ID in my css as I learned in this thread:<br /> <a href="http://forum.gravityhelp.com/topic/different-styles-for-different-pages#post-1643" rel="nofollow">http://forum.gravityhelp.com/topic/different-styles-for-different-pages#post-1643</a></p> <p>The examples given here worked like a charm on my form for changing the title, but for some reason I cannot get it to work on any other css within the form. I don't get it!</p> <p>So, assuming my form is ID 6, I've entered this to change the title to green:<br /> <code>form#gform_6 .gform_heading h3.gform_title { color:green }</code></p> <p>Works great, so then I did the same with the description and tried changing the font color:<br /> <code>form#gform_6 .gform_wrapper span.gform_description { color: red;font-weight:normal }</code></p> <p>...but this has no effect. Why? Shouldn't it be working? In fact, a larger question I have is couldn't I just append <code>form#gform_6</code> to every single style element in the css?</p> <p>Can anyone explain why the above doesn't work? </p>