https://legacy.forums.gravityhelp.com/topic/styling-validation-error-messages Gravity Support Forums Topic: Styling Validation Error Messages en-US Sun, 19 Apr 2026 23:24:04 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/styling-validation-error-messages#post-238283 Sun, 05 May 2013 09:17:48 +0000 Kevin Flahaut 238283@https://legacy.forums.gravityhelp.com/ <p>Okay, the first thing I see is that the ready classes aren't being implemented correctly and I would bet that's causing most of your layout woes. The "left_half" and "right_half" classes are supposed to work together left+right and so on. You have left, right, left, left, left, left. I see what you're trying to do, but those classes are designed to create simple two column layouts where the fields are the same size.</p> <p><a href="http://i.imgur.com/qWKPFdO.jpg" rel="nofollow">http://i.imgur.com/qWKPFdO.jpg</a></p> <p>What I would do is use the HTML blocks to add inline div "wrapper" elements and actually create 2 div "columns" to align your fields the way you want. It's going to be a tad more work building the form and CSS, but it's going to be more forgiving and bulletproof from a layout standpoint.</p> <p>Here's an example of what I'm talking about.</p> <p><a href="http://www.gravityhelp.com/forums/topic/how-can-i-get-the-form-fieldsboxes-side-by-side#post-29425" rel="nofollow">http://www.gravityhelp.com/forums/topic/how-can-i-get-the-form-fieldsboxes-side-by-side#post-29425</a></p> <p>Once you get the layout sorted properly I think the validation styling shouldn't be a problem.. if anything, just may need some minor tweaking. </p> https://legacy.forums.gravityhelp.com/topic/styling-validation-error-messages#post-237033 Sat, 04 May 2013 12:33:53 +0000 Kevin Flahaut 237033@https://legacy.forums.gravityhelp.com/ <p>Hey, sorry, I did see this post but haven't had a chance to go back and research it thoroughly to give you some pointers. I'll do that asap but wanted to let you know I hadn't forgotten you. Thanks for your patience. </p> https://legacy.forums.gravityhelp.com/topic/styling-validation-error-messages#post-234130 Thu, 02 May 2013 18:56:36 +0000 Phormosa 234130@https://legacy.forums.gravityhelp.com/ <p>Kevin,</p> <p>Thanks for the help. You can find the form at <a href="http://justrank.it/" rel="nofollow">http://justrank.it/</a> </p> <p>The form is at the very bottom. Just hit submit without filling anything out and you'll understand what's going on. Thanks! </p> https://legacy.forums.gravityhelp.com/topic/styling-validation-error-messages#post-232763 Wed, 01 May 2013 22:52:19 +0000 Kevin Flahaut 232763@https://legacy.forums.gravityhelp.com/ <p>Can you post a URL to your form so we can check it out. It's a lot easier to offer some help if we can see the actual form. Thanks. </p> https://legacy.forums.gravityhelp.com/topic/styling-validation-error-messages#post-232673 Wed, 01 May 2013 21:27:46 +0000 Phormosa 232673@https://legacy.forums.gravityhelp.com/ <p>I'm having a hard time styling the validation error messages - I've adjusted the positioning for the various inputs/fields for the form, and it looks great when there's no errors. But when there are, the whole thing just looks totally wrong with various fields just going completely out of alignment when the errors pop up. Here's some css targeting that I've done that hasn't worked (gravity-last-name is a custom class and the positioning values are exaggerated for testing purposes): </p> <pre><code>.gravity-last-name .validation_error { position:relative; padding: 0px; margin: 0px; width: 140px; top: -300px !important; } */ /*#field_2_10 .gfield_error { position:relative; padding: 0px; margin: 0px; width: 140px; left: -300px !important; top: -500px !important; } .gfield_error .validation_message .gravity-last-name { position: relative; top: 100px;</code></pre>