Title: multiple columns Last modified: December 28, 2016 --- # multiple columns * Resolved [cagraphicdesign](https://wordpress.org/support/users/cagraphicdesign/) * (@cagraphicdesign) * [9 years, 5 months ago](https://wordpress.org/support/topic/multiple-columns-19/) * I am new to this plugin and not to good with coding. What is the best way to set up a very simple form (name, phone, email, submit) to be all be displayed horizontally. I assume it will take some css so I want to style it so the css will work. Not sure if I should choose INHERIT or NONE or whatever. I will need help with the css…if that is beyond your support help I understand and will find someone to help me. See it here: [http://tecompanies.com/dev-cagd/](http://tecompanies.com/dev-cagd/) * Thanks and was happy to donate. - This topic was modified 9 years, 5 months ago by [cagraphicdesign](https://wordpress.org/support/users/cagraphicdesign/). Viewing 10 replies - 1 through 10 (of 10 total) * Plugin Author [Lehel Szilard Marosi](https://wordpress.org/support/users/mlehelsz/) * (@mlehelsz) * [9 years, 5 months ago](https://wordpress.org/support/topic/multiple-columns-19/#post-8603657) * Hey there, * We could manage to have a horizontal form on your page. * You have to do the following steps to achieve that: 1. You have to navigate to the CSS editor part of our Add-on. This should look like as on the following image: [https://s.w.org/plugins/contact-form-7-style/screenshot-6.jpg](https://s.w.org/plugins/contact-form-7-style/screenshot-6.jpg)( please ignore the setup from the image yours should be empty) * 2. Add the following CSS snippet to the field on that page: * ``` body .cf7-style.cf7-style-132 p { display: inline-block; } ``` * 3. The result should look like this: [http://screencast.com/t/3L2c5IxW](http://screencast.com/t/3L2c5IxW) Warning: Please be careful, this will only work with current active custom style. * Cheers, * Thread Starter [cagraphicdesign](https://wordpress.org/support/users/cagraphicdesign/) * (@cagraphicdesign) * [9 years, 5 months ago](https://wordpress.org/support/topic/multiple-columns-19/#post-8604593) * THANKS SO MUCH. I sort of have what I want after playing around with all the options. I am stuck on two things: I cannot figure out why I have all that space above the form..I want it to snug up right under the the headline above it. The box allowed for the form has a huge amount of space above it and I am not sure what option I should be setting to change that. * Also, the client wants a two line bit of copy for the phone number and I sort of accomplished that by adding another content box but I am wondering if it would be better to add it to the form itself. You can sort of see what I am after by looking at my second attempt on the site but of course I would need to align them. AND I need to make the input boxes shorter so the submit button does not jump to under the form. * You will also see that I was not able to perfectly align the submit button no matter even with adjust it to center. * Plugin Author [Lehel Szilard Marosi](https://wordpress.org/support/users/mlehelsz/) * (@mlehelsz) * [9 years, 5 months ago](https://wordpress.org/support/topic/multiple-columns-19/#post-8625521) * Hey there, * Did you manage to fix the issue? As I see on this page the form look great: [http://tecompanies.com/dev-cagd/](http://tecompanies.com/dev-cagd/) * Thread Starter [cagraphicdesign](https://wordpress.org/support/users/cagraphicdesign/) * (@cagraphicdesign) * [9 years, 5 months ago](https://wordpress.org/support/topic/multiple-columns-19/#post-8626019) * I was working on fixing it and set the width of the input boxes and fussed with it a lot to get the submit button centered there. I did not do it the prescribed way because it was just not reacting as it should. The odd thing which you should take note of is that when I am logged in to the admin area, the space between the headline and the contact form was much much bigger. When I logged out it looks as you probably see it. Did I mention I was using Beaver Builder theme and plugin? I still would like to take out more space so it aligns with the CLICK TO CALL. I now have the headline in a row above the contact form and phone number. The contact form and phone number are in the same row in two separate content boxes so theoretically they should line up as I have the same content box settings for both. Thanks again for getting back to me. I will certainly mention your plugin at the next wordpress meet up I attend. Contact forms are a big subject. * Thread Starter [cagraphicdesign](https://wordpress.org/support/users/cagraphicdesign/) * (@cagraphicdesign) * [9 years, 5 months ago](https://wordpress.org/support/topic/multiple-columns-19/#post-8627222) * Wait! I figured out a workaround to fix that extra space above the forms. Within the beaver builder page builder I adjusted the top margin of the content box for the form to -20px and left the phone number at 0px. I did the same thing with the other contact form lower on the page but did it at -7. Just kept changing the numbers until they looked right. * [jcbb](https://wordpress.org/support/users/jcbb/) * (@jcbb) * [9 years, 4 months ago](https://wordpress.org/support/topic/multiple-columns-19/#post-8706793) * Hi all, * Useful plugin! although I cant quite get it to do what I require,. * The above example is what I`m trying to achieve (not succeeding) although learning alot. I simple horizontal bar with two input elements (name and phone and submit) is what I looking for. The above example looks good, I tried the CSS route but it did nothing although I suspect I was targeting the wrong class? * body .cf7-style.cf7-style-132 p { display: inline-block; } * I used