R Chilton
Member
I would like to use my own image for the "submit button" The image shows up but I am not sure how to remove the "submit" text. The code I have used so far is:
.gform_wrapper .gform_footer .gform_button {
background: url("images/submitbutton.png") no-repeat !important;
border-style:none !important;
}
This gives me the look I am after but you can see the text submit small in the background.
Thanks
If you are using an image you can always just place the image path in the Form Settings area:
http://www.gravityhelp.com/documentation/page/File:Form-settings-advanced.png
Otherwise, if you want to retain it in CSS, you'll need to probably do a text-indent: -9999px; to make the text go away.
R Chilton
Member
That works perfectly - one other question. So I deleted the previous css, used the "forms settings advanced" and entered the image url. I tried applying a custom css class within the form settings and then adding it to my styles.css however it seems to style the entire form. I want to target the submit image specifically. I was able to us
.gform_image_button
to target the position of the button
the only thing left is the background image that I used in my image url is appearing smaller than the original. Tried using some css in some places but can not seem to get the original size of the image.
thank for the help.
Can you hook me up with a link to your form so I can check it out?
R Chilton
Member
Here it is
http://whistlerworks.com/clients/langston/site/
Bottom left on the newsletter signup.
Thanks
Update your style.css with this replacement block:
[css]
.gform_image_button {
margin-left: 50px;
margin-top: -20px;
height: auto;
}In your style.css you have a generic input rule that is setting a height on all inputs, so the submit button is an input so we want it's height to be auto instead of the 24px of the input element style.
No problem - glad to help out!