/*submit button center*/
.et_contact_bottom_container{
display: flex;
align-items: center;
justify-content: center;
width: 100% !important;
}
/*submit button center end*/
How to center the submit button in Divi
Posted by George Nicolaou
On 15 Sep, 2017
You may also like…
How to store values from WP Forms into an external remote Database
How to remove visual composer shortcodes when switching to Divi or any other theme
Ever wanted to remove Visual Composer / WP Bakery shortcodes from your content?
It Works! Thank You Very Much.
Glad it helped
Thanks for posting this solution. We are stuck with a button on the left. Using your code we have aligned it in the middle. One last thing, we want to increase the button width so that it takes the full space as the contact form. Tried several css codes. Not working. Can you help please?
Of course, I can help. Could you give me a specific page to look at? Also, it actually depends on how you did the design. If you want you can give me back-end access and I can do it for you
It is usually something like
.et_pb_contact_form_container.et_pb_contact_form_container .et_contact_bottom_container .et_pb_contact_submit.et_pb_button {
Width: 97%;
}
Very helpful! Worked Like a charm. Do you have another article explaining how to move the button lower?
Send me a link to help out but I think you need to add something like margin-top:30px; to your CSS. Play around with the number to get the results you want
Worked beautifully! Thank you!
glad to hear that
On divi form, I can’t align the button in the middle using this code.
It seems that it is stuck on the left side when I used
Please take a look at the site
klassquared.com/contact
Thanks
Try this
.et_contact_bottom_container{
display: flex;
align-items: center;
justify-content: center;
width: 100% !important;
}
n divi form, I can’t align in the middle using this code.
#et_pb_contact_form_0 .et_contact_bottom_container {
float: none!important;
text-align: center!important;
}
It stuck on the left side when I used that code ..
Please take a look at the site
klassquared.com/contact
Nice tutorial. How do I know the form number? Your line added a new contact form, and changed nothing.
My answer is in a video I made for you https://youtu.be/vpvWv_ZCPvg
It’s wonderful, thanks a lot!
No problem
It Works! Thank You Very Much!! 😀