Can't center Contact Form 7 plugin's submit button

Support
#1

Hello

I’m making good progress on my website and everything is nice and tidy. There’s just one small annoyance. I’m using the Contact Form 7 plugin and for some reason, even if I use the CSS panel in Cornerstone, I can’t center the submit button. Could anyone help me? The problem is on both my home and contact pages.

Thank you,
Tai Jones

#2

Hi Tai Jones,

Thanks for writing in!

You can center the submit button by editing your contact form and change the submit button code into this:

<p style="text-align: center;">[submit "Send"]</p>

We would love to know if this has worked for you. Thank you.

#3

This doesn’t really work. Well, it kind of does but not quite. When I reload the page, it’s like The X Theme notices that it’s supposed to center the button and the button is centered for just a fraction of a second. Then it pops back to a slightly off center position. Any more suggestions?

Thank you,
Tai Jones

#4

Hi Tai Jones,

It’s off center a little bit because there’s a hidden element after it. Try adding this too.

.wpcf7 .ajax-loader {
    display: none;
}

Though that element is intended to be there . See this: https://screencast-o-matic.com/watch/cqifhKO1I5

Hope this helps.

#5

Perfect! Thank you very much.

Just one more question though. Will there be any bad side effects from setting that one element to display: none? I’m asking since it’s intended to be there.

Thank you,
Tai Jones

#6

Hi Tai,

The element is there to show when you submit the form. It’s there to show the site visitor that after you submit, need not to do anything because the form is submitting the infomation. It is not recommended to hide it as you like to happen.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.