Depends on your definition of “easy”.
It’s trivial with some custom CSS. Make the width 50% (or so) and float them both left.
Anyone have CSS already written for this that they’d like to share?
I really would like 2 columns as well but I have no experience with CSS.
I’ve added this to the wish list.
If anyone can provide this code I would be willing to make a $30 donation for the code.
I mocked this up for you on my test site:
http://greatvines2015.staging.wpengine.com/contact-us
** DISCLAIMER: This has not been tested across all browsers, only Chrome on Mac OSX 10.11. It is also only set to fix text input, select and textarea (comment fields) **
You could try adding this to your theme’s custom CSS file and tweaking the “width” parameters. This is currently set to 70/30% but you could also fix a specific size for each column using “300px” and “700px” which would actually be quite wide. I also added the “text-align: right” with padding as it is generally a best practice to align form labels to the right in a two column orientation.
/* =========================== */
/* Example two-column form layout for WP */
/* =========================== */
div.salesforce_w2l_lead label.w2llabel {
clear: left;
float: left !important;
width: 30% !important;
text-align: right;
padding-right: 1em;
}
div.salesforce_w2l_lead select.w2linput,
div.salesforce_w2l_lead textarea.w2linput,
div.salesforce_w2l_lead input.w2linput {
clear: none !important;
width: 70% !important;
}
div.salesforce_w2l_lead input.w2linput {
height: 2em !important; // adjust height of the input boxes
}
/* =========================== */
Thanks for the information above. This didn’t really create two columns for me. It only indented the Title’s of each input field on my form. I’m using Jupiter theme by Artbees.
