https://legacy.forums.gravityhelp.com/topic/errors-styling-issue Gravity Support Forums Topic: Errors Styling Issue en-US Mon, 20 Apr 2026 04:27:51 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/errors-styling-issue#post-62267 Tue, 12 Jun 2012 11:18:47 +0000 Paal Joachim 62267@https://legacy.forums.gravityhelp.com/ <p>Thank you very much for the piece of code Richard!</p> <p>To remove the top error message one can add a display:none. The below code is what Richard suggested (I am not using the first li code though, as I have not seen a reason yet why to use it) and I then added a display: none to it. From my tests it seems to work fine.</p> <pre><code>/* Error message on the top */ body .gform_wrapper .validation_error{ margin-top:10px; padding:5px; background-color:#f9d400; border:1px solid #c89797; display: none; } /* Validation errors that comes up by each field */ body .gform_wrapper .gform_body .gform_fields .gfield_error .validation_message { border:1px solid red; background-color:#f9d400; width:50%; }</code></pre> https://legacy.forums.gravityhelp.com/topic/errors-styling-issue#post-47146 Mon, 23 Jan 2012 14:35:23 +0000 adamdanielmedia 47146@https://legacy.forums.gravityhelp.com/ <p>This helps perfectly, thank you. Loving Gravity Forms! </p> https://legacy.forums.gravityhelp.com/topic/errors-styling-issue#post-47071 Sun, 22 Jan 2012 06:00:18 +0000 Richard Vav 47071@https://legacy.forums.gravityhelp.com/ <p>Hi, you can't actually replace the huge error box because that box is actually the li that contains the field label, inputs and description, it just has extra styles applied when validation fails so what you will have to do is override those extra styles so it doesn't look any different than the normal li, add the following to your themes main or custom stylesheet.<br /> <pre><code>body .gform_wrapper .gform_body .gform_fields .gfield_error{background:#fff;border:0;margin:0 !important;padding:0 !important}</code></pre> <p>Now that the li error styles are looking like a standard li again you can now style the error message, again add the following css to your stylesheet, you can change the border, background color, width, padding and margins to whatever gets the appearance you are looking for.<br /> <pre><code>body .gform_wrapper .gform_body .gform_fields .gfield_error .validation_message {border:1px solid red;background-color:#f9d400;width:50%}</code></pre> <p>If you also want to style the main error message that appears at the top of the form you would add and modify the following<br /> <pre><code>body .gform_wrapper .validation_error{margin-top:10px;padding:5px;background-color:#f9d400;border:1px solid #c89797}</code></pre> <p>Hope this helps </p> https://legacy.forums.gravityhelp.com/topic/errors-styling-issue#post-47062 Sat, 21 Jan 2012 17:54:26 +0000 adamdanielmedia 47062@https://legacy.forums.gravityhelp.com/ <p>I've been unable to find a way to change the default style of validation errors: a huge box that surrounds the indicated field. I can change details like color, but not the overall style.</p> <p>I'd like to replace the huge box with a small box that only shows below the field in question, not all around it, with the error message text inside.</p> <p>Is this possible?</p> <p>Thank you! </p>