Transcript:
Hey everybody, I’m David from Divi Space. Today I am going to show you how to center the submit button of the Divi contact form. By default, it’s aligned to the right and there is no option in the Divi Module Settings to change it.
Here is the Divi CSS code controlling the button and that we need to overwrite.
What you’ll want to do is go to the page settings and paste the CSS code snippet that you can find in the video description.
Yup, it’s that simple.
This is part of the Divi Space Snippet Series, thanks for watching the video and we’ll see you in the next one.
how do you align the button to the left?
change text-align property to left
.et_contact_bottom_container { float: none; text-align: left; display: block !important; }I adjust the CSS to:
.et_contact_bottom_container {
float: none;
text-align: left;
display: block !important;
}
but my button out of the form div and to the very left side of the screen. I am trying to get it to align with the fields in the contact form.
Have you tried changing just float to left?
Hi guys. It gives me the errors:
Expected RBRACE.
&
Unexpected Token ‘}’
Any suggestions?
Hi Ray, make sure you are adding the CSS in the correct place.
This works for desktop, but doesn’t appear center on mobile when using my ph?
What do you mean by “ph”?
Perfect solution. Thanks for saving our time.
Hi, do you know how to do to make the width of the button equals to de width of the contact form? I only have this format with the “email optin module” not with the contact form.
button.et_pb_contact_submit.et_pb_button { width: 100%;}Didn’t work until I added “display: block !important;” per Alejo’s recommendation. You need to revise your tutorial.
Thanks, Alejo!
Thanks! We updated our snippet 🙂
is not working, the button go to the left always.
Hi artisticbox, share a link so I can help you 🙂
Hi, try adding display: block !important;
Thanks!