Hello,
This looks pretty straightforward though it requires a couple of CSS centering techniques.
For the text input you can simply define automatic margins to the left and right and it should center:
input#mce-EMAIL { margin: 0 auto; }
For the label, it doesn’t quite work so we can try another trick to increase the width and then center the text:
.mc-field-group label { width: 100%; text-align: center; }
Finally the subscribe button is somewhat tricky. It’s wrapped in a div with all sorts of funky stuff going on so the easiest thing to do is to manually specify some widths and then use automatic margins:
div.clear { width: 100px; margin: 0 auto; }
input#mc-embedded-subscribe { width: 100px; }
You can also change the background color simply by specifying it and a new text color because white text is usually pretty hard to read on a white background 😉
input#mc-embedded-subscribe {
background-color: #fff;
color: #000;
}
I hope this is helpful.
thanks so much for taking the time to reply! i tried all of the above and only the first fix worked i ended up using another subscribe form plugin (mailpoet) and to my surprise i have the same problem w this form im thinking maybe its my theme?
Your theme will define the structural elements of the website and some themes are more friendly to work with than others. I would advise looking into several additional types of CSS centering, and perhaps look into making a custom template in your child theme to better work with the subscribe function.
Good luck and if you find a solution, be sure to post it here so that others can use it for future reference.
