https://legacy.forums.gravityhelp.com/topic/design-layout Gravity Support Forums Topic: Design & Layout en-US Mon, 20 Apr 2026 04:45:28 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/design-layout#post-28930 Fri, 01 Jul 2011 06:01:10 +0000 layean 28930@https://legacy.forums.gravityhelp.com/ <p>Thanks so much Kevin. Form layout is now fixed. Lay Ean </p> https://legacy.forums.gravityhelp.com/topic/design-layout#post-28856 Thu, 30 Jun 2011 08:57:19 +0000 Kevin Flahaut 28856@https://legacy.forums.gravityhelp.com/ <p>@layean</p> <p>Your default form styes aren't being output in your page. Go to your forms settings page (FORMS &gt; SETTINGS) in the left nav.. and verify that the "output css" option is set to "yes". Get back to me if it is and you still have the formatting problems. </p> https://legacy.forums.gravityhelp.com/topic/design-layout#post-28846 Thu, 30 Jun 2011 03:13:38 +0000 layean 28846@https://legacy.forums.gravityhelp.com/ <p>Hi, I have a question regarding the form I’ve created. Please see the page where I’ve uploaded the form <a href="http://goparents.com.au/competitions/win-1-of-3-the-kennedys-dvds-starts-now" rel="nofollow">http://goparents.com.au/competitions/win-1-of-3-the-kennedys-dvds-starts-now</a><br /> The theme I am using is Thesis theme.<br /> The fields are not aligned and I can’t get rid of the bullet points. Can you please help?<br /> Thanks<br /> Lay Ean </p> https://legacy.forums.gravityhelp.com/topic/design-layout#post-28844 Thu, 30 Jun 2011 02:49:58 +0000 gregmason 28844@https://legacy.forums.gravityhelp.com/ <p>Great! Thank you very much Kevin! I will chat to them. </p> https://legacy.forums.gravityhelp.com/topic/design-layout#post-28842 Wed, 29 Jun 2011 23:47:54 +0000 Kevin Flahaut 28842@https://legacy.forums.gravityhelp.com/ <p>The problem is coming from your theme CSS. WooThemes has some Gravity Forms specific styles built into their themes, and they've chosen to override the "top label" option and force all the field labels to float to the left. Along with that, they've decided to limit the label width to just 100px. That's causing your label to wrap. If we disable that property ( on line 781 of your theme's style.css file ) then you'll see the label doesn't wrap.</p> <p>screenshot: <a href="http://bit.ly/l1bTP8" rel="nofollow">http://bit.ly/l1bTP8</a></p> <p>If we turn off the other properties that specify the left float, margins, etc. You'll see the default Gravity Forms layout is restored.. which is much more readable.</p> <p>screenshot: <a href="http://bit.ly/lsaTTh" rel="nofollow">http://bit.ly/lsaTTh</a></p> <p>So, that said, it would be best to consult the WooThemes support team and see how they would recommend overriding/removing these styles in their theme. This should point you in the right direction to get it all sorted. </p> https://legacy.forums.gravityhelp.com/topic/design-layout#post-28765 Wed, 29 Jun 2011 02:43:12 +0000 gregmason 28765@https://legacy.forums.gravityhelp.com/ <p>Hi, I have a similar question regarding the width of a field. I unfortunately do not have any CSS knowledge but have read through some of your documentation. I understand that I am able to amend the layout of a field through the advanced options and inputting a CSS Class Name. I have tried many examples from the documentation but nothing has worked (I did have luck moving it to the right half with gf_right_half but i want it to span the full width). Please can you assist me with the correct CSS Class Name to input into the advanced options of the field to get the pricing field to span the full width of the page as opposed to wrapping the text to fit into the left half. Here is my form <a href="http://encierrospecials.co.za/?page_id=60" rel="nofollow">http://encierrospecials.co.za/?page_id=60</a> and i want to get the pricing option "Entrepreneur ROS 728x90..." to span the full width of the page and not wrap the text over 4 lines. </p> <p>Thanks for the assistance.<br /> Greg </p> https://legacy.forums.gravityhelp.com/topic/design-layout#post-24224 Wed, 27 Apr 2011 08:22:00 +0000 Kevin Flahaut 24224@https://legacy.forums.gravityhelp.com/ <blockquote><p>However, where do I put my css?</p></blockquote> <p>You would put any new CSS rules in your theme's stylesheet or custom CSS area. We discourage making any changes to the default forms.css file in the plugin folder since that gets overwritten with each upgrade and any changes you make there would be wiped out.</p> <blockquote><p>Are there any template forms (design wise not form field-wise) that I can just choose to use instead of making my own designs?</p></blockquote> <p>Currently no. That's something we're considering for an add-on in the future.</p> <blockquote><p>Am I able to state how wide I want my form to be? At the moment it takes up the entire width of my page which looks crazy.</p></blockquote> <p>Yes, you can redefine the width on the main gform_wrapper element. </p> <pre><code>[css] body .gform_wrapper { width:640px }</code></pre> <p>Everything will resize appropriately to fit along with it. See the first section here for CSS samples and instructions.</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> <blockquote><p>Am I able to have a nicer looking captcha? The default color is brown and yellow and ugly. Am I able to have a nice stylish looking captcha that will match will the colors and style of the form that I make?</p></blockquote> <p>I'm not sure where you're seeing brown, but the reCaptcha field has 4 theme/color options you can choose from.</p> <p>screenshot: <a href="http://grab.by/9YPW" rel="nofollow">http://grab.by/9YPW</a></p> <p>reCaptcha is a third-party service that we integrate with our forms so we don't control the formatting/layout of the reCaptcha field beyond what few options they offer. Of course, you can inspect the page source with a tool like <a href="http://getfirebug.com/" rel="nofollow">firebug</a> or the safari developer tools, see what the class names and IDs are in the markup and then add your own CSS to manipulate the output if you want.</p> <p>You can also use the <a href="http://wordpress.org/extend/plugins/really-simple-captcha/" rel="nofollow">Really Simple Captcha</a> plugin. If you have that installed, you'll see it as an option displayed in the Captcha field. That is a very simple layout with a couple of more flexible styling options that you might prefer. </p> https://legacy.forums.gravityhelp.com/topic/design-layout#post-24216 Wed, 27 Apr 2011 03:25:58 +0000 amandastretton 24216@https://legacy.forums.gravityhelp.com/ <p>I understand that I can make my gravity form look however I like with css.</p> <p>I know a little bit of css and feel comfortable that I will figure out what I have to do to get the form looking the way I want in time.</p> <p>However, where to I put my css?</p> <p>Are there any template forms (design wise not form field-wise) that I can just choose to use instead of making my own designs?</p> <p>Am I able to state how wide I want my form to be? At the moment it takes up the entire width of my page which looks crazy.</p> <p>Am I able to have a nicer looking captcha? The default color is brown and yellow and ugly. Am I able to have a nice stylish looking captcha that will match will the colors and style of the form that I make?</p> <p>Thanks for your help.<br /> Amanda </p>