Title: Responsive Two Column CF7 Last modified: August 30, 2016 --- # Responsive Two Column CF7 * Resolved [alpinevp](https://wordpress.org/support/users/alpinevp/) * (@alpinevp) * [10 years, 5 months ago](https://wordpress.org/support/topic/responsive-two-column-cf7/) * I have scoured the posts and none of the two column solutions are responsive. * Can a form made with CF7 contain two columns and be responsive? * [https://wordpress.org/plugins/contact-form-7/](https://wordpress.org/plugins/contact-form-7/) Viewing 6 replies - 1 through 6 (of 6 total) * [davmerit](https://wordpress.org/support/users/davmerit/) * (@davmerit) * [10 years, 5 months ago](https://wordpress.org/support/topic/responsive-two-column-cf7/#post-6763524) * > Can a form made with CF7 contain two columns and be responsive? * Yes. you could consider using [Contact Form 7 Skins](https://wordpress.org/plugins/contact-form-7-skins/) to style your Contact Form 7 Forms. * You can now use the add-on [CF7 Skins Ready](http://cf7skins.com/add-ons/ready/) to make a 2 column contact form. * [davmerit](https://wordpress.org/support/users/davmerit/) * (@davmerit) * [10 years, 5 months ago](https://wordpress.org/support/topic/responsive-two-column-cf7/#post-6763543) * See also the following [CF7 Skins Documentation](http://kb.cf7skins.com/) which might help you: * [Contact form 7 form in columns](http://kb.cf7skins.com/contact-form-7-form-in-columns/)– shows how to place form fields vertical columns using the [CF7 Skins Ready Add-on](http://cf7skins.com/add-ons/ready/). * Thread Starter [alpinevp](https://wordpress.org/support/users/alpinevp/) * (@alpinevp) * [10 years, 5 months ago](https://wordpress.org/support/topic/responsive-two-column-cf7/#post-6763549) * I’ve tried the code examples from other similar posts that uses ordered lists in a column and while that works fine for a desktop, it is ugly as all get out for mobile as CF7 appears to only be responsive if it is in a single line one column display. * I fail to understand why developers today still ignore basic responsive mobile development for their products for REAL WORLD USE. * Thanks Dave * Thread Starter [alpinevp](https://wordpress.org/support/users/alpinevp/) * (@alpinevp) * [10 years, 5 months ago](https://wordpress.org/support/topic/responsive-two-column-cf7/#post-6763550) * Also, here’s the code example they share that is claimed to be 2 columns and responsive and what it looks like on my site, this example is supposed to be 3 columns. * ```
column
    1. Ready Class column
    2. Item1 [text item1a]
    3. Dropdown Menu [select cf7s-menu-01 multiple include_blank "Item1" "Item2" "Item3"]
    4. Item2 [text item2a]
    1. Ready Class column
    2. Item1 [text item1b]
    3. Item2 [text item2b]
    4. Item3 [text item3b]
    5. Dropdown Menu [select cf7s-menu-01 multiple include_blank "Item1" "Item2" "Item3"]
    1. Ready Class column
    2. Item1 [text item1c]
    3. Item2 [text item2c]
    4. Item3 [text item3c]
    5. Dropdown Menu [select cf7s-menu-01 multiple include_blank "Item1" "Item2" "Item3"]
    1. Ready Class column
    2. Item1 [text item1d]
    3. Dropdown Menu [select cf7s-menu-01 multiple include_blank "Item1" "Item2" "Item3"]
    4. Item2 [text item2d]
    1. Ready Class column
    2. Item1 [text item1e]
    3. Item2 [text item2e]
    4. Item3 [text item3e]
    5. Dropdown Menu [select cf7s-menu-01 multiple include_blank "Item1" "Item2" "Item3"]
``` * Thread Starter [alpinevp](https://wordpress.org/support/users/alpinevp/) * (@alpinevp) * [10 years, 5 months ago](https://wordpress.org/support/topic/responsive-two-column-cf7/#post-6763554) * FYI – Here is the exact way to do it, html and css included and it really is column based and responsive. * [http://www.wpsnippet.com/creating-responsive-two-column-form-using-contact-form-7/](http://www.wpsnippet.com/creating-responsive-two-column-form-using-contact-form-7/) * [davmerit](https://wordpress.org/support/users/davmerit/) * (@davmerit) * [10 years, 5 months ago](https://wordpress.org/support/topic/responsive-two-column-cf7/#post-6763589) * [@alpinevp](https://wordpress.org/support/users/alpinevp/) The code you have pasted has no CSS to it 🙂 – Some CSS classes have been used in the code, you need CSS + HTML to make a form responsive. You won’t be able to make your form responsive with only HTML. * The above code shows you how to use [CF7 Skins Ready](http://cf7skins.com/add-ons/ready/) classes to make your form a multi-column form * You definitely can not make your CF7 Form responsive wi​​th this code if you are **NOT** using CF7 Skins Ready which is an add-on to the free [CF7Skins](https://wordpress.org/plugins/contact-form-7-skins/) plugin. Viewing 6 replies - 1 through 6 (of 6 total) The topic ‘Responsive Two Column CF7’ is closed to new replies. * ![](https://ps.w.org/contact-form-7/assets/icon.svg?rev=2339255) * [Contact Form 7](https://wordpress.org/plugins/contact-form-7/) * [Frequently Asked Questions](https://wordpress.org/plugins/contact-form-7/#faq) * [Support Threads](https://wordpress.org/support/plugin/contact-form-7/) * [Active Topics](https://wordpress.org/support/plugin/contact-form-7/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/contact-form-7/unresolved/) * [Reviews](https://wordpress.org/support/plugin/contact-form-7/reviews/) * 6 replies * 2 participants * Last reply from: [davmerit](https://wordpress.org/support/users/davmerit/) * Last activity: [10 years, 5 months ago](https://wordpress.org/support/topic/responsive-two-column-cf7/#post-6763589) * Status: resolved