Mailchimp signup form styling change

[lookpro]

Hi there,
I have had a good look around the forum but can’t seem to get anywhere near what I’m trying to achieve.
I can’t style the mailchimp signup form to make it appear on 1 line with a heading above it. I have included a pic of how I would like it to look (as close as possible anyway)
I need the form to be on one line with, the font above the fields in white and the button to be a different colour to the site wide buttons.
If possible can the name field be shorter than the email field?
Thanks!

http://dev.abnorml.com.au

[paul.r]

Hi,

I checked and can see you are using Mailchimp fo wordpress plugin.

Regretfully, we cannot provide support for third party plugins or scripts as our support policy in the sidebar states due to the fact that there is simply no way to account for all of the potential variables at play when using another developer’s plugin or script. Because of this, any questions you have regarding setup, integration, or troubleshooting any piece of functionality that is not native to X will need to be directed to the original developer.

Thank you for your understanding.

[lookpro]

Hi @paul.r

Understand! I have since removed the 3rd party plugin and installed the one that comes with X but still can’t get it to work with some of the other code examples on the forum. Could you share some code that you think may work?

Thanks

[ruenel]

Hello Paul,

Please set the maximum width of your Email Forms to at least 60 or more.

And then please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.tco-subscribe-form fieldset {
    float: left;
    max-width: 30.666%;
    margin-right: 1%;
}

.tco-subscribe-form fieldset:last-of-type{
    margin-right: 0;
}

.tco-subscribe-form input[type="submit"] {
    margin-top: 1.3em;
}

We would loved to know if this has work for you. Thank you.

[lookpro]

@RueNel no sorry, did not work to make it inline

[friech]

Hi Paul,

Please check all your custom CSS first here and resolved all found errors. And then you can add Ruenel’s given CSS code again.

Cheers!