https://legacy.forums.gravityhelp.com/topic/styling-dropdown Gravity Support Forums Topic: Styling Dropdown en-US Sat, 04 Apr 2026 15:24:42 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/styling-dropdown#post-27543 Fri, 10 Jun 2011 11:25:31 +0000 Kevin Flahaut 27543@https://legacy.forums.gravityhelp.com/ <p>You would have to use jQuery/CSS to essentially replace the default select form control. Something like this.</p> <p>tutorial: <a href="http://www.jankoatwarpspeed.com/post/2009/07/28/reinventing-drop-down-with-css-jquery.aspx" rel="nofollow">http://www.jankoatwarpspeed.com/post/2009/07/28/reinventing-drop-down-with-css-jquery.aspx</a></p> <p>demo: <a href="http://www.jankoatwarpspeed.com/examples/reinventing-drop-down/Select2DropDown.html" rel="nofollow">http://www.jankoatwarpspeed.com/examples/reinventing-drop-down/Select2DropDown.html</a></p> <p>There are several other similar methods you could explore, some are easier than others. You just have to find the one that works best for you.</p> <p>Google: <a href="http://j.mp/iJvKJ7" rel="nofollow">http://j.mp/iJvKJ7</a> </p> https://legacy.forums.gravityhelp.com/topic/styling-dropdown#post-27521 Fri, 10 Jun 2011 09:56:05 +0000 mr_pa 27521@https://legacy.forums.gravityhelp.com/ <p>Hi kevin,</p> <p>thanks for your explanation!</p> <p>One more thing: is there the possibility to delete (or override) the default (i suppose of the browser) trigger icons of the select fields for example adding a particular image?</p> <p>Sorry for my bad english but i'm italian!</p> <p>I hope to point out which is the meaning of my question.</p> <p>Thanks,</p> <p>P. </p> https://legacy.forums.gravityhelp.com/topic/styling-dropdown#post-27513 Fri, 10 Jun 2011 09:01:49 +0000 Kevin Flahaut 27513@https://legacy.forums.gravityhelp.com/ <p>That's in the documentation under the heading "Drop-Down (Select) Field"</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> <pre><code>[css] body .gform_wrapper .gform_body .gform_fields .gfield select {border:1px solid red}</code></pre> <p>if you wanted to apply the rule to one specific select element (drop down field) then you would view the source, note the unique ID and target it like this. Just change the "input_1_1" to your actual ID.</p> <pre><code>[css] body .gform_wrapper .gform_body .gform_fields .gfield select#input_1_1 {border:1px solid red}</code></pre> https://legacy.forums.gravityhelp.com/topic/styling-dropdown#post-27504 Fri, 10 Jun 2011 04:50:12 +0000 mr_pa 27504@https://legacy.forums.gravityhelp.com/ <p>Hi Dear,</p> <p>i've just finished a deep search in the support forum but i didn't found a complete post in order to make customization of the dropdown menu. I had a look of the css reference but nothing.</p> <p>I'd like to apply a background image to the drop down options filed and after that make some changes in the layout of the select menu.</p> <p>Could you give me some tips regarding this issue?</p> <p>Many thanks!</p> <p>P. </p>