[Shan_HBGParticipant]

Hello,

I want to make the name field, email field and submit button on my Mailchimp form sit side-by-side on one line. They default to stacked, and I can’t figure out how to make them sit on the same line! None of the CSS I’ve tried works. Can you please help me?

The form is at the bottom of the page, here:
https://spreadablewords.com/about/

Thank you very much!
Shannon

[Shan_HBGParticipant]

P.S. I dropped the naked code from MailChimp into a text box to create this form. No plugin. 😉

[Shan_HBGParticipant]

This reply has been marked as private.

[RupokMember]

Hi there,

Thanks for writing in! As you are using naked form, you won’t get styling. But I can help you to align them inline. You can add this under Custom > CSS in the Customizer.

form#mc-embedded-subscribe-form {
  margin: 0 auto;
  width: 600px;
}
#mc-embedded-subscribe {
  padding: 10px;
  position: relative;
  top: 2px;
  width: 40%;
}
#mc-embedded-subscribe-form .form-group {
  display: inline-block;
  float: left;
  width: 30%;
}
#mc-embedded-subscribe-form .form-group input {
  height: 45px !important;
  margin-top: 5px;
  padding: 10px !important;
  width: 90%;
}

Hope this helps!

[Shan_HBGParticipant]

This code worked GREAT. Thank you very much!

[Rue NelModerator]

Hello There,

You’re always welcome. That’s what we are here for.
If you need anything else, please let us know.

Cheers.

[Author]

Posts