Two columns layout with two sub-columns in them

Hello,

I'm trying to build a form like this one (http://www.despachotres.com/bocetos/gravity-forms.png) but I'm unable. Is it possible to do it?

As you can see, I want two main columns and, inside each one, two columns with fields.

Thanks in advance.

Hi Rob,

I've checked this info, and I'm applying it...but didn't manage to work it out completely. I'll tell you the fields I'm using (and which classes I'm applying):

- Section Break (for the left column): class "gf_left_half"
- Number E1 (no classes)
- Number E2 (no classes)
- Number E3 (no classes)

- Section Break (for the right column). class "gf_right_half"
- Number P1 (no classes)
- Number P2 (no classes)
- Number P3 (no classes)

In this example, I'm trying to create a form with 2 columns and 3 fields under each column. This is the preview of the form: http://www.despachotres.com/bocetos/columns-form.jpg

Wham am I doing wrong?

In regards to the this will only work with the top label layout option - in the form settings at the top of editing the form, there is an option for label placement. Top is the default.

To achieve the columns, you need to place the classes on each field and alternate them. So you would have the first section break with gf_left_half then the next section break right after with gf_right_half. Then your input field with gf_left_half, then the next with gf_right_half, etc. Just rinse and repeat.

subscribing...

Daniel, can you hook me up with a link to your form?

Daniel/Sascha to achieve columns within columns you can just combine the ready classes.

So, to achieve the columns, you need to place the classes on each field and alternate them. So you would have the first section break with gf_left_half then the next section break right after with gf_right_half.

Then for your radio/checkboxes you would place:

gf_left_half gf_list_2col on the first set and then gf_right_half gf_list_2col on the second set.

Keep in mind that the column ready classes work only with multiple choice/checkbox lists. I'm sure we can whip up some sort of css magic of some kind if you are using different fields to try to achieve what you are looking for in terms of using other fields within the columns.

Daniel, figured it out for you. Since we are placing a new div ID into the mix, the ready classes don't fall in line with that HTML structure, so simply add this to your theme's stylesheet:

[css]
#columna_izquierda .gf_inline, #columna_derecha .gf_inline {
vertical-align: top;
zoom: 1;
width: auto !important;
float: none !important;
display: -moz-inline-stack;
display: inline-block;
zoom: 1;
}
#columna_izquierda input.small, #columna_derecha input.small {
width: 5em;
}