Viewing 4 replies - 1 through 4 (of 4 total)
  • The layout of the form is controlled completely by the layout supplied in the form setup. The form setup screen will take any html elements and produce the proper output. To achieve what you are looking for, there are a number of options:

    To set up a 2 column layout, you can change the default code

    <p>Field Label<br />
        [field_type field_name]</p>

    And remove the <br /> which puts the next element on a new line to come up with:
    <p>Field Label: [field_type field_name]</p>

    Or you can use a table layout and put each field in its own <tr></tr>:

    <table>
       <tr>
         <td>Field Label</td>
         <td>[field_type field_name]</td>
       </tr>
    </table>

    Or if you have knowledge of styling through CSS you can use lists and put each field in its own <li></li>:

    <ul>
       <li>
         <label>Field Label: </label>[field_type field_name]
       </li>
    </ul>

    Please do not use table markup for forms. Table markup is for data tables – not for styling a page. All you need to style a form in CF7 is some CSS skill.

    @esmi, I agree, tables should not be used in forms, however, if you do not possess the experience in working with CSS and are working on a personal site, tables do allow you to generate a side-by-side layout for labels and fields.

    Thread Starter vcoronel

    (@vcoronel)

    Great. Thank you for your help. will try your advise but I have an addtional question:

    I you see my form https://victorcoronel.com/galapesca2015/contact-galapesca/ you will probably see that the field “Select Department (required)” is way to skinny compared to all other input fields. How do I make it as tall as all other fields?

    Thank you in advance

    Victor

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘contact form’ is closed to new replies.