WordPress.org

Ready to get started?Download WordPress

Forums

MailChimp for WordPress
[resolved] HARDLY any CSS knowledge.. All 3 boxes on the same line... (3 posts)

  1. wolffchelsea
    Member
    Posted 5 months ago #

    Hello Danny,

    First of all, thank you so much for doing a great job with this clean and simple plugin! I love it!

    Now, stubborn as I am, I want to achieve the following:

    On my homepage I want a bar 200px high and 660px wide. Inside that bar I would like people to be able to subscribe to my mailchimp newsletter.

    This basically means that I'm trying to get all the input boxes on the same line, aligned horizontally (if this makes any sense... gosh it's hard to try to explain this...)

    so: Box1 Box2 Box3 Submit-Button
    instead of

    Box1
    Box2
    Box3
    Submit-Button

    What can you do for me? :)

    https://wordpress.org/plugins/mailchimp-for-wp/

  2. Danny van Kooten
    Member
    Plugin Author

    Posted 5 months ago #

    Hi there,

    Glad you like the plugin!

    To do this, we will need to write some CSS. Something like the following piece of CSS should get us started.

    .mc4wp-form {
    	display: block;
    	max-width: 660px;
    	height: 200px;
    }
    
    .mc4wp-form input{
    	display: inline-block;
    	box-sizing: border-box;
    	width: 20%;
    	margin:0;
    }

    Make sure you have all paragraphs <p> tags removed from your form mark-up in order to get this to work though.

    On a related side note, the premium version of this plugin makes this all a little easier because it has a CSS generator that does stuff like this quite well.

    PS. Marking this as resolved as it is not a plugin issue, makes it a little easier for me to keep track of real issues.

    Hope that helps!

  3. wolffchelsea
    Member
    Posted 5 months ago #

    Thank you!!

Reply

You must log in to post.

About this Plugin

About this Topic