https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme Gravity Support Forums Topic: Form taking on the styling of my theme. en-US Sun, 05 Apr 2026 17:41:59 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme#post-29006 Fri, 01 Jul 2011 18:09:52 +0000 Kevin Flahaut 29006@https://legacy.forums.gravityhelp.com/ <p>Great. I'm pleased I could help. </p> https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme#post-28996 Fri, 01 Jul 2011 16:34:49 +0000 shorn 28996@https://legacy.forums.gravityhelp.com/ <p>Hi there! Thats brilliant! really appreciated! Two problems solved! </p> https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme#post-28854 Thu, 30 Jun 2011 08:51:19 +0000 Kevin Flahaut 28854@https://legacy.forums.gravityhelp.com/ <p>Your styles add extra left/right padding which effectivly increases the default widths of the inputs and that's why they're overflowing the wrapper on the right. You can add this to your theme stylesheet to reduce the width of the last name input slightly so it fits properly. I also included a rule to change the button state on hover.. you can tweak that to suit your needs.</p> <pre><code>[css] body .gform_wrapper .ginput_complex .ginput_right input, body .gform_wrapper .field_name_last input { width: 90% !important; } body .gform_wrapper .gform_footer input#gform_submit_button_1.button:hover { background-color: #000; }</code></pre> <p>screenshot: <a href="http://bit.ly/lyRzZ7" rel="nofollow">http://bit.ly/lyRzZ7</a> </p> https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme#post-28806 Wed, 29 Jun 2011 15:42:41 +0000 shorn 28806@https://legacy.forums.gravityhelp.com/ <p>Hi there,<br /> sorry for the delay in responding, been away for a while.</p> <p>The form is here...<br /> <a href="http://lavishstudios.co.uk/?page_id=4" rel="nofollow">http://lavishstudios.co.uk/?page_id=4</a></p> <p>As you can see each element is styled to match the site, but the name fields are a little too wide. Im not sure how to change these. Also, I would like to add a hover over effect (background colour change) on the submit button if thats possible? (to match the "continue reading" button on the font page. Thanks. </p> https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme#post-28579 Mon, 27 Jun 2011 11:28:13 +0000 Kevin Flahaut 28579@https://legacy.forums.gravityhelp.com/ <p>@shorn</p> <p>Can you post a URL to your form page? It will be easier for me to help out if I can see the form itself, what styles are being inherited, not, etc. </p> https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme#post-28577 Mon, 27 Jun 2011 10:19:52 +0000 shorn 28577@https://legacy.forums.gravityhelp.com/ <p>Hi, thanks for the reply. Shortly after reading your reply, I kinda worked it out, so I'm feeling a bot more confident about going through my theme and applying the relative styling from my themes css file and applying to the different elements of each of my form. </p> <p>I have a couple of further questions however, that I have been unable to work out.<br /> I have added added some styling to standard text fields, and this has styled the element of the form which is a "name" field (first and last name), however when I change the width, it does not change in this field, and therefore the two side by side is a bit too wide for my theme. </p> <p>Secondly, I have styled my Submit button, but is there a way to style a hover over? i.e a different colour when the cursor is over it?</p> <p>Many thanks! </p> https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme#post-28561 Sun, 26 Jun 2011 11:39:17 +0000 Kevin Flahaut 28561@https://legacy.forums.gravityhelp.com/ <p>Gravity Forms are designed to inherit some of their styling from the theme - font styles, colors, etc. along with some styles for the form inputs themselves if they exist in your theme. Without seeing your form, It sounds like there aren't really any form styles in your theme right now, or else they're very specific to an existing form and your new forms don't inherit from those rules.</p> <p>You can add your own new styles to your active theme's style.css file. Here's some documentation on how to properly target all of the form elements so you can manipulate them with CSS.</p> <p><a href="http://www.gravityhelp.com/documentation/page/CSS_Targeting_Samples" rel="nofollow">http://www.gravityhelp.com/documentation/page/CSS_Targeting_Samples</a></p> <p>If you run into problems, please post a URL to your form page and I'll be happy to take a look and help out. </p> https://legacy.forums.gravityhelp.com/topic/form-taking-on-the-styling-of-my-theme#post-28560 Sun, 26 Jun 2011 08:48:12 +0000 shorn 28560@https://legacy.forums.gravityhelp.com/ <p>Hi all, </p> <p>Just looking for a quick nudge in right direction. I have added a form to my main site and one in the sidebar, however these forms have taken on none of the style/css of my main site theme. </p> <p>Am I right in thinking I will need to add or change something within the css files to achieve this?<br /> I used your documentation to remove the bullet points that were showing, and my theme has a handy custom.css file to add any such changes, which make it easier than editing the main css file. </p> <p>Any point in the right direction will be greatly appreciated! Thanks! </p>