https://legacy.forums.gravityhelp.com/topic/custom-submit-button-almost-there Gravity Support Forums Topic: Custom Submit button: almost there... en-US Tue, 21 Apr 2026 23:09:33 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/custom-submit-button-almost-there#post-13466 Sat, 27 Nov 2010 15:45:43 +0000 Kevin Flahaut 13466@https://legacy.forums.gravityhelp.com/ <p>@Biagio,</p> <p>Thanks so much for the kind words. We try really hard to provide the best service we can and I'm very pleased to hear that you're happy. If you need any other help, don't hesitate to ask. </p> https://legacy.forums.gravityhelp.com/topic/custom-submit-button-almost-there#post-13459 Sat, 27 Nov 2010 13:55:07 +0000 biagio111 13459@https://legacy.forums.gravityhelp.com/ <p>Kevin,<br /> Clearly, getting the developer license yesterday is not something I'll ever regret. Of every paid service I've ever been a part of, you are the fastest, most responsive guy I've ever seen. Surfing the forums last night, where I was able to find your answers to many questions, I learned a lot...not the least of which was how much you care about your customers.</p> <p>Your answers were perfect, and now I understand how to target things properly...thanks! Everything's working.</p> <p>Best,<br /> Biagio </p> https://legacy.forums.gravityhelp.com/topic/custom-submit-button-almost-there#post-13457 Sat, 27 Nov 2010 11:16:13 +0000 Kevin Flahaut 13457@https://legacy.forums.gravityhelp.com/ <p>When you use CSS to do the image replacement tecnique, you have to hide the default text by using a negative text-indention.</p> <p><code>body #gform_wrapper_1 .gform_footer input.button {text-indent:-9000px]</code></p> <p>on the input field, it just looks like you want to turn the border off and then tweak the size a little</p> <p><code>body #gform_wrapper_1 input#input_1_1 {border:none}</code></p> <p>test screenshot: <a href="http://grab.by/7BqR" rel="nofollow">http://grab.by/7BqR</a></p> <p>You'll notice I used a specific CSS inheritance and unique input ID rather than just using the simple .large and .button classes. Unless you really plan to use that background on every field in every form with a .large class, it's better to be more specific. The same goes for the .button class.</p> <p>Hope that helps. </p> https://legacy.forums.gravityhelp.com/topic/custom-submit-button-almost-there#post-13451 Sat, 27 Nov 2010 06:31:27 +0000 biagio111 13451@https://legacy.forums.gravityhelp.com/ <p>Forgot one last thing, which I'm sure you'll see: similarly trying to target the field shape with the field from the theme, but have them both showing up. Targeted it like this:<br /> <pre><code>.large { background: url(images/fields.png) 0 0; }</code></pre> <p><a href="http://www.accessdv.com/d2dl" rel="nofollow">http://www.accessdv.com/d2dl</a></p> <p>I'm still a css newbie, so thanks for your patience.<br /> Best,<br /> Biagio </p> https://legacy.forums.gravityhelp.com/topic/custom-submit-button-almost-there#post-13450 Sat, 27 Nov 2010 05:01:50 +0000 biagio111 13450@https://legacy.forums.gravityhelp.com/ <p>Trying to use a rollover image for my submit button. You can see what I'm trying to do on my sandbox site here:</p> <p><a href="http://www.accessdv.com/d2dl" rel="nofollow">http://www.accessdv.com/d2dl</a></p> <p>Originally I'd tried using the custom button option in the advanced settings of the form itself, but of course, as it's a rollover image, it showed the whole thing. Right now, I'm targeting the button like this:</p> <pre><code>.button { background: url(images/submit.png) 0 0; border: none; cursor: pointer; width: 101px; height: 32px; float: left; margin: 0 499px 0 0; } .button:hover { background: url(images/submit.png) 0 -32px; }</code></pre> <p>That pretty much works, but you can still see some of the "base button" behind it...haven't been able to turn that off. Any help appreciated. Thanks!</p> <p>Biagio </p>