Gravity Support Forums Topic: Layout of header text and form fields

Gravity Support Forums Topic: Layout of header text and form fields https://legacy.forums.gravityhelp.com/topic/layout-of-header-text-and-form-fields Gravity Support Forums Topic: Layout of header text and form fields en-US Sun, 19 Apr 2026 20:14:03 +0000 http://bbpress.org/?v=1.0.1 <![CDATA[Search]]> q https://legacy.forums.gravityhelp.com/search.php Rob Harrell on "Layout of header text and form fields" https://legacy.forums.gravityhelp.com/topic/layout-of-header-text-and-form-fields#post-56303 Mon, 23 Apr 2012 21:33:50 +0000 Rob Harrell 56303@https://legacy.forums.gravityhelp.com/ Right on, glad you got it working. fsluijs on "Layout of header text and form fields" https://legacy.forums.gravityhelp.com/topic/layout-of-header-text-and-form-fields#post-56284 Mon, 23 Apr 2012 17:35:53 +0000 fsluijs 56284@https://legacy.forums.gravityhelp.com/ Hi Rob, excellent advice! The indent addition worked instantly. For the shades I looked up the styles in the style sheet and made the modifications. In the end, I choose not to add the style names to the style sheet like you suggested, but made my own file with a copy of those style atributes and imported this into the styles.css. So if the theme updates in the future, I still have the custom code, just need to check for updates in the sections that I copied. For future reference - maybe this helps other users - I'm pasting the solution here. I'm using the Ares theme by Peerapong from ThemeForest.net My style.css now looks like this: <pre><code>/* Theme Name: Ares Description: Blog Magazine Newspaper Template Version: 1.5.2 Author: Peerapong Pulpipatnan Author URI: <a href="http://themeforest.net/user/peerapong" rel="nofollow">http://themeforest.net/user/peerapong</a> */ @import "css/screen.css"; /* Description: Import Prettig Weekend custom styles for Ares theme Author: Frank's Website Advies */ @import "css/pw_ares_custom.css";</code></pre> (<a href="http://pastie.org/3841667" rel="nofollow">http://pastie.org/3841667</a>) My pw_ares_custom.css looks like this: <pre><code>/* Area: Gravity Forms Description: These additions are to correct a style issue for Gravity Forms in combination with Ares. This makes the Postcode and Plaats end up on the same line, instead of having a break in between. Author: Frank's Website Advies */ #input_1_7 br { display: none !important; } #input_3_2 br { display: none !important; } /* Area: Gravity Forms Description: make sure the form fields are not indented compared to the text on a page. Author: Frank's Website Advies */ ul.gform_fields { margin-left: 0 !important; } /* Area: Gravity Forms Description: apply same style on phone, e-mail and website fields as on other fields in the form. Author: Frank's Website Advies */ input[type="url"], input[type="email"], input[type="tel"], input[type="number"], select { padding: 8px; font-size: 12px; margin: 0; padding-top: 8px; border: 1px solid #dddddd; background: #fff; font-family: Arial,"helvetica neue",Helvetica,Verdana,sans-serif; color: #666; } input[type=url]:hover, input[type=email]:hover, input[type=tel]:hover, input[type=number]:hover { border: 1px solid #999999; } input[type=url].blur, input[type=email].blur, input[type=tel].blur, input[type=number].blur { color: #ccc; font-style: italic; }</code></pre> (<a href="http://www.pastie.org/3841667" rel="nofollow">http://www.pastie.org/3841667</a>) Thanks again for your help! Rob Harrell on "Layout of header text and form fields" https://legacy.forums.gravityhelp.com/topic/layout-of-header-text-and-form-fields#post-56203 Mon, 23 Apr 2012 11:55:41 +0000 Rob Harrell 56203@https://legacy.forums.gravityhelp.com/ That's due to your theme's stylesheet, for instance you have this: <pre><code>[css] input[type="text"], input[type="password"], select { padding: 8px; font-size: 12px; margin: 0; padding-top: 8px; border: 1px solid #DDD; background: white; font-family: Arial,"helvetica neue",Helvetica,Verdana,sans-serif; color: #666; }</code></pre> Which is only targeting input types of text, password and select (drop downs). You can update/change that to be: <pre><code>[css] input[type="text"], input[type="url"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], select, textarea { padding: 8px; font-size: 12px; margin: 0; padding-top: 8px; border: 1px solid #DDD; background: white; font-family: Arial,"helvetica neue",Helvetica,Verdana,sans-serif; color: #666; }</code></pre> For the indents your stylesheet has: <pre><code>[css] #content_wrapper .inner .inner_wrapper .sidebar_content ul { margin-left: 20px; }</code></pre> That margin is your issue. So you could add this to your stylesheet: <pre><code>[css] ul.gform_fields { margin-left: 0 !important; }</code></pre> fsluijs on "Layout of header text and form fields" https://legacy.forums.gravityhelp.com/topic/layout-of-header-text-and-form-fields#post-56202 Mon, 23 Apr 2012 11:46:07 +0000 fsluijs 56202@https://legacy.forums.gravityhelp.com/ Hi, On this page I have some layout issues: <a href="http://nieuw.prettig-weekend.nl/contact/" rel="nofollow">http://nieuw.prettig-weekend.nl/contact/</a> 1. The middle two fields have a shadow in the box, the others do not. I'd like them to be the same, so all having shadows or none having shadows. How can I modify this? 2. The form fields seem to be indented when compared to the text. How can I get this aligned, preferably not indented at all? Thanks!