Viewing 5 replies - 1 through 5 (of 5 total)
  • This is due to CSS styling applied to standard HTML form elements within your current WordPress theme.

    To change the style of your CF7 forms you would need to edit the CSS style sheets used by your WordPress theme.

    See Styling Contact Form for a general explanation of styling CF7 forms using CSS.

    There is a link at the bottom of the page to a comprehensive and detailed article on Styling Contact Form 7 Forms.

    ??I use Ordered List elements to display multiple fields on single line.

    HTML:

    <ol class="singleline">
    <li> <label for="your-name">Your Name (required) </label> [text* your-name] </li>
    <li> <label for="your-email">Your Email (required) </label> [email* your-email] </li>
    </ol>

    Added to Form section of CF7 interface. <label> tags are added for improved accessability.

    CSS:

    .wpcf7-form .singleline ol {
    list-style: none;
    margin: 0;
    }
    
    .wpcf7-form .singleline li{
    display: inline-block;
    margin-right: 10px;
    }

    Sorry for the first reply, I think I miss-read the question – I believe you are looking to put your form fields in 2 vertical columns.

    You could consider using Contact Form 7 Skins to style your Contact Form 7 Forms.

    You can now use the add-on CF7 Skins Ready to make a 2 column contact form.

    Thread Starter odedkineret

    (@odedkineret)

    Thank you !

    Hi, Do I understand correctly that to change the width size of Contact 7, one needs to add code to the same place that has name, email, etc.

    On my website, the contact space is too wide for my theme. Is it possible to reduce the width of the spaces?

    If it’s easier to view the site here’s the address:

    jenncastro.com

    Thanks for your help.

    @jenniferlcastro as per the Forum Welcome, please post your own topic. ?I would be watching out for your question to offer you a possible solution.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Two columns’ is closed to new replies.