https://legacy.forums.gravityhelp.com/topic/kevin-flahquts-tips-for-css-targeting-specific-elements-not-working-on-my-check Gravity Support Forums Topic: Kevin Flahaut's tips for css targeting specific elements not working on my check en-US Mon, 20 Apr 2026 01:26:43 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/kevin-flahquts-tips-for-css-targeting-specific-elements-not-working-on-my-check#post-38376 Wed, 19 Oct 2011 19:10:51 +0000 Kevin Flahaut 38376@https://legacy.forums.gravityhelp.com/ <p>My pleasure. You're very welcome. </p> https://legacy.forums.gravityhelp.com/topic/kevin-flahquts-tips-for-css-targeting-specific-elements-not-working-on-my-check#post-38371 Wed, 19 Oct 2011 17:47:35 +0000 waujaneju 38371@https://legacy.forums.gravityhelp.com/ <p>Thanks, Kevin! </p> https://legacy.forums.gravityhelp.com/topic/kevin-flahquts-tips-for-css-targeting-specific-elements-not-working-on-my-check#post-38263 Wed, 19 Oct 2011 02:48:15 +0000 Kevin Flahaut 38263@https://legacy.forums.gravityhelp.com/ <p>Style support for checkboxes and radio inputs is very limited and varies quite a bit by each browser. The border style is only supported in a few. You're rule is being applied properly, but the browser is simply ignoring it for the checkbox control.</p> <p>screenshot: <a href="http://bit.ly/qcWvtt" rel="nofollow">http://bit.ly/qcWvtt</a> ( see the highlighted CSS rule being applied )</p> <p>reference: <a href="http://www.456bereastreet.com/lab/styling-form-controls-revisited/checkbox/" rel="nofollow">http://www.456bereastreet.com/lab/styling-form-controls-revisited/checkbox/</a></p> <p>I'll revisit the samples in the documentation and see about changing that. The border property was simply a random example, but I can see that it might be misleading given the constraints of styling the checkbox inputs. </p> https://legacy.forums.gravityhelp.com/topic/kevin-flahquts-tips-for-css-targeting-specific-elements-not-working-on-my-check#post-38260 Wed, 19 Oct 2011 01:29:19 +0000 waujaneju 38260@https://legacy.forums.gravityhelp.com/ <p>Following the advice provided by Kevin Flahaut on this page: <a href="http://www.rocketgenius.com/gravity-forms-css-targeting-specific-elements/" rel="nofollow">http://www.rocketgenius.com/gravity-forms-css-targeting-specific-elements/</a><br /> I added the following code to my wordpress css:</p> <pre><code>[css] /* gravity forms text field */ body .gform_wrapper .gform_body .gform_fields .gfield input[type=text] { border:1px solid #dddddd; background-color:#f8f9fb; } /* gravity forms drop-down (select) field */ body .gform_wrapper .gform_body .gform_fields .gfield select {border:1px solid #dddddd; background-color:#f8f9fb; } /* gravity forms textarea field */ body .gform_wrapper .gform_body .gform_fields .gfield textarea {border:1px solid #dddddd; background-color:#f8f9fb; } /* gravity forms checkbox inputs */ body .gform_wrapper .gform_body .gform_fields .gfield .gfield_checkbox li input[type=checkbox] {border:1px solid #aec1d2;}</code></pre> <p>It worked perfectly EXCEPT the checkbox inputs, as you can see here:</p> <p><a href="http://dev12.campaignadvantage.com/action/volunteer/" rel="nofollow">http://dev12.campaignadvantage.com/action/volunteer/</a></p> <p>So I tried Kevin's original code example in my css, which should have made the checkbox input borders red, but it didn't. Could you please help me figure out why Kevin's code does not appear to be working for my checkbox inputs, even though its working perfectly for the other fields?</p> <p>Thanks! </p>