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

  1. wolffchelsea
    Posted 2 years 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


    What can you do for me? :)


  2. Danny van Kooten
    Plugin Author

    Posted 2 years 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%;

    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
    Posted 2 years ago #

    Thank you!!

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • MailChimp for WordPress
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic