https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css Gravity Support Forums Topic: Headway and Gravity CSS en-US Wed, 22 Apr 2026 00:04:03 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43695 Sun, 11 Dec 2011 09:20:40 +0000 Rob Harrell 43695@https://legacy.forums.gravityhelp.com/ <p>Erin, the first declaration above will style the look of the form boxes. The color that is shown there will be what the user types into the box (input/textarea).</p> <p>The label (text that shows with the form box) is another piece you could change the color of, for example you could place this into your theme's stylesheet to change the label color:</p> <pre><code>[css] .gform_wrapper .top_label .gfield_label { color: #003300; }</code></pre> <p>There isn't a video tutorial on this, but there is a good amount of documentation, which is on the link up above:</p> <p><a href="http://www.gravityhelp.com/documentation/page/Design_and_Layout" rel="nofollow">http://www.gravityhelp.com/documentation/page/Design_and_Layout</a> </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43673 Sat, 10 Dec 2011 21:54:24 +0000 Erin 43673@https://legacy.forums.gravityhelp.com/ <p>Hey Rob,</p> <p>I have found the Gravity Form code in my CSS Style sheet. </p> <p>Here is what I can see:</p> <pre><code>[css] .gform_wrapper input, .gform_wrapper textarea, .gform_wrapper select { background: #ffffff !important; color: #003300!important; font-family: Georgia, Arial, Tahoma, Verdana !important; font-size: 12px !important; padding: 4px 0 4px 5px !important; border: 1px solid #DDDDDD; } .gform_footer input.button { color: #FFFFFF !important; } .gform_wrapper .ginput_complex label { font-size: 12px !important; } .gform_wrapper li, .gform_wrapper form li { margin: 0 0 10px 0 !important; } .gform_wrapper .gform_footer { border: none !important; }</code></pre> <p>Is there a video tutorial on where I can customize my forms to change the colors in CSS? I am not sure where I should be adding extra code within the section above.</p> <p>Thank you,<br /> Erin </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43641 Sat, 10 Dec 2011 13:22:27 +0000 Rob Harrell 43641@https://legacy.forums.gravityhelp.com/ <p>Yes, you can use the short code builder to place the form and then just send a link to it so we can check it out if you need assistance/guidance. You will want to edit styles at the theme level. </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43629 Sat, 10 Dec 2011 10:35:07 +0000 Erin 43629@https://legacy.forums.gravityhelp.com/ <p>Hey Rob,<br /> That makes sense not to edit the plug in. Do I use short code to include that form on my contact page so that you can view it? If so, what line of code would I need to include in my contact page for you to be able to view it? </p> <p>Thank you,<br /> Erin </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43628 Sat, 10 Dec 2011 10:10:01 +0000 Rob Harrell 43628@https://legacy.forums.gravityhelp.com/ <p>Hey Erin, no problem. Actually I'd need a login to view that particular link since it's a preview. Can you either place the form on a publicly accessible page or if you need to keep it private you can feel free to email me a login to <a href="mailto:rob@rocketgenius.com">rob@rocketgenius.com</a></p> <p>We won't be editing the plugin because doing that would mean each time we release an update to the plugin your changes would get wiped out. </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43626 Sat, 10 Dec 2011 10:02:43 +0000 Erin 43626@https://legacy.forums.gravityhelp.com/ <p>Hey Rob,<br /> Thank you for replying back. I use Coffee Cup to make changes to my website. Am I able to change the look of my gravity forms by editing my Gravity Plug In? Or is there a line of code which I need to add to my main CSS style sheet?</p> <p>Are you able to view the form from this link? </p> <p><a href="http://www.erinsecolist.com/?gf_page=preview&amp;id=1" rel="nofollow">http://www.erinsecolist.com/?gf_page=preview&amp;id=1</a></p> <p>Any advice on how I can tweak this would be greatly appreciated. :)</p> <p>Thank you,<br /> Erin </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43623 Sat, 10 Dec 2011 08:44:43 +0000 Rob Harrell 43623@https://legacy.forums.gravityhelp.com/ <p>Hey Erin, you will want to do all of your custom styling in your theme's stylesheet. You should be able to hook onto plenty of elements as-is. However, you can add custom classes as you're describing to then target in your style sheet. Got a link to your form? I can help you get to where you'd like to be if you need some guidance. :) </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43604 Sat, 10 Dec 2011 00:48:45 +0000 Erin 43604@https://legacy.forums.gravityhelp.com/ <p>Sorry, I meant to ask Rob Harrell this question. </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43603 Sat, 10 Dec 2011 00:47:26 +0000 Erin 43603@https://legacy.forums.gravityhelp.com/ <p>Hello Katie,</p> <p>I have installed the Gravity Forms plug in on my website. I am creating a new contact form. In order for me to change the colours/design of the form, do I go to "Advanced" and include new CSS code in "CSS Class Name" field? </p> <p>Thank you,<br /> Erin </p> https://legacy.forums.gravityhelp.com/topic/headway-and-gravity-css#post-43570 Fri, 09 Dec 2011 17:58:57 +0000 Rob Harrell 43570@https://legacy.forums.gravityhelp.com/ <p>Katie, then to target the li's you would do something like:</p> <pre><code>[css] body.custom .gform_wrapper ul li.gfield { margin: 15px 0; }</code></pre> <p>For the descriptions:</p> <pre><code>[css] body.custom .gform_wrapper .gfield_description { font-size: 20px; }</code></pre> <p>Obviously change the values and add styles as needed there. </p>