/*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
by George Nicolaou | 15 September, 2017 | Divi Theme Code Snippets | 17 comments
Necessary cookies are absolutely essential for the website to function properly. This category only includes cookies that ensures basic functionalities and security features of the website. These cookies do not store any personal information.
Any cookies that may not be particularly necessary for the website to function and is used specifically to collect user personal data via analytics, ads, other embedded contents are termed as non-necessary cookies. It is mandatory to procure user consent prior to running these cookies on your website.
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!! 😀