Horizontal Opt-In form

Best Wordpress plugin to engage your users and collect their email. You can use header alerts, popups, or exit pages, and it works with any popular emailing service such as Mailchimp or AWeber
Shane Fielder
Junior Member
Posts: 1
Joined: Tue Sep 04, 2012 3:28 am

Horizontal Opt-In form

Post by Shane Fielder »

I am trying to create a one line horizontal opt-in form with the following syntax/structure on a 700 pixel wide page:

[Text goes here] [email text input field] [subscribe button]

What is the CSS coding required to do this?

Thank you for your help, it is greatly appreciated. :)
Junior Member
Posts: 10
Joined: Thu Apr 05, 2012 5:37 am

Post by AskKim »

I'm on a similar hunt to what Shane is seeking. Many of the popup templates do a respectable job of offering the form in a horizontal view... but the in-post box defaults to a top-down format. What custom css needs added to get the content elements inside .ia_form to display in a horizontal manner?
Posts: 49
Joined: Thu Jan 26, 2012 7:43 pm

Post by flogger123 »

Hi guys, looks like that this is a rare issue. Found any answer to this by any chance? Image
Junior Member
Posts: 10
Joined: Thu Apr 05, 2012 5:37 am

Post by AskKim »

I'm using this at http://just-ask-kim.com/blog. The part of particular importance is the clear statement. However, the form itself still does not sit quite right but it's close enough for the moment that I've stopped tinkering. Notice the huge gap in the middle where the form should sit more to the left.

.ia_form {clear:none}
.ia_content {float:left; width:50%}
.ia_form {float:right; width:50%;}
.ai-optin-form {margin-bottom:20px}
Eduardo Cordeiro
Junior Member
Posts: 2
Joined: Sat Jul 26, 2014 7:10 pm

Post by Eduardo Cordeiro »

I´m trying to find the answer to this too. I need a custom form with the following structure:
[Text goes here]
[email text input field] [subscribe button]
Jean-Christophe Bisoux
Posts: 283
Joined: Tue Feb 28, 2012 10:36 am
Location: Canillo, Andorra

Post by Jean-Christophe Bisoux »

to do this you must use the custom CSS, but it's different for each template and for that I can't give you a model without seeing the issue on live

Junior Member
Posts: 1
Joined: Fri Jul 28, 2017 4:36 am

Post by leinsoy07 »

Has anybody been able to get this working? I've been trying to find the CSS to get [input field] [submit button] side by side and so far no luck. Can anybody help?
Post Reply