Nicolap
Member
I have searched through the forums here and tried various suggested methods, but nothing works for me.
I am trying to move the Post (ie Submit) button on this form to be in line with the Attach Image field, on the right. I'm using Headway theme.
http://www.damsels.org/testing/
What CSS would I need for that? Thanks.
Do I need to login to see the form or is it on another page?
No problem. This should do the trick for you (place into your theme's stylesheet):
[css]
#gform_widget-5 .gform_footer.top_label {
float: right;
margin: -85px 335px 0 0;
}I'm trying to do the same thing on the home page of http://alabamacoolingandheating.com/ under the heading of "Quick Contact Form"
I want to move the submit button, in-line, to the right of the phone number. I'm having difficulty targeting the button.
Richard Vav
Administrator
@bamajr try adding the following towards the bottom of your theme's custom.css file
#gform_wrapper_4 .gform_footer.top_label {
float: right;
margin: -55px 140px 0 0;
}It should result in your form looking like this but you can play around with the margins to re-position it.
Regards,
Richard
@Richard,
Thank you... I must have missed the
'#gform_wrapper_4'
ID, because I've tried targeting just about everything else. This does work. Now I just have to work on resizing the button, so that it is similar in size, to the "Submit Post" button, on this support forum.
Quick off-top question: What did you use, to display the code, to the right of the website, in the screenshot, you provided, above (I.E. what browser and add-ons)?
Richard Vav
Administrator
I was using Google Chrome and the panel on the right is the developer tools (inspector) which on Windows can be accessed by pressing F12 or Ctrl+Shift+i or by right clicking an element on the page and selecting 'inspect element'. IE, Firefox, Opera and Safari all have their own version.
As for the submit button you would target it like so
#gform_wrapper_4 .gform_footer input.button {
padding: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}Again Richard,
Thanks....
I don't know what the deal is, but I cannot get the developer tools, to open, using the shortcuts. I use them all the time, but didn't know they could be repositioned to the right, as you did it. They didn't look the same as I'm used to seeing them below, instead of on the right. I have been able to move them, now, but still can't access them via keyboard shortcuts... Oh well!
I have the form and submit button, working and looking, the way my client wants it, now. I have one more question, about this form, but it is definitely something I need to post separately (using this form to populate another form). Any direction you can give, would be appreciated, though.
I am trying to move the "Submit" button next to the email form field. Can you provide the css to accomplish this please. I am using an IThemes Builder template and the site is located at http://kathyfirak.kathyjf.com/MiracleB/ The form I am referring to is located in the top right corner. I need to do this for just this form because I will be adding other forms to this same website.
Thanks,
Kathy
Richard Vav
Administrator
Hi Kathy,
Try using the following CSS, your widget was too narrow for the field and button to be placed side by side so the first part of the CSS below increases it's width. I have only guessed the figures, you can play around with them until you get it looking how you want it.
#gform_widget-3 {
width: 50%;
}
#gform_widget-3 .gform_footer.right_label {
float: right;
margin: -52px 0 0 0;
}Regards,
Richard
I'm trying to do the same thing: submit button on an email sign-up. Need it to float right so that widget bar isn't so tall. http://www.empoweredfrench.com
Thanks so much!
Madeleine
Richard Vav
Administrator
Hi Madeline,
Try adding the following CSS to your theme's stylesheet or wherever you add custom CSS
#gform_widget-2 .gform_footer.top_label {
float: right;
margin: -67px -100px 0 0;
}Regards,
Richard
Thanks Richard! I knew it was probably just a question of the margins I had to figure out, but since I'm an amateur coder & doing my own site (which is why I use Wordpress, iThemes, & Gravity Forms!), it would have taken me a week and loads of frustration to figure them out.
Madeleine
Richard Vav
Administrator
Madeleine, you're welcome.