PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Fields in 3 and 4 columns

  1. Cheo
    Member

    Hello.

    I use to have a problem using 2 coumns, but I solved with some older post.

    But now I want to use 3 and 4 columns in a Form

    http://celfin.org/agencia/fondos-mutuos/aporte/

    here I need that Cliente (ID 4_3), Rut (ID 4_4) and Portafolio (ID 4_56) use 3 columns, I already managed to do that, but not in the best of ways.

    But now I need Fondo (ID 4_5), Serie (ID 4_6), Monto (ID 4_11) and Porcentaje (ID 4_58) to be in the same colum. Im kind of manege to do it, but it's mess the footer and a lot of stuff.

    Is there a way to put things in 3 and 4 columns?

    I Know that is has to be with CSS, I already move som things, but can't do it.

    Here is the things that i have in CSS

    #gform_wrapper_1.gform_wrapper .top_label input.medium, #gform_wrapper_1.gform_wrapper .top_label select.medium {width:90%;}
    #gform_wrapper_2.gform_wrapper .top_label input.medium, #gform_wrapper_2.gform_wrapper .top_label select.medium {width:90%;}
    #gform_wrapper_4.gform_wrapper .top_label input.medium, #gform_wrapper_4.gform_wrapper .top_label select.medium {width:90%;}
    #gform_wrapper_5.gform_wrapper .top_label input.medium, #gform_wrapper_5.gform_wrapper .top_label select.medium {width:90%;}
    #gform_wrapper_6.gform_wrapper .top_label input.medium, #gform_wrapper_6.gform_wrapper .top_label select.medium {width:90%;}
    
    #field_1_3, #field_2_3, #field_4_3, #field_4_9, #field_5_3, #field_6_3, #field_6_11, #field_6_58 {float:left;}
    
    #field_4_4 {float:right;}
    
    #field_1_3, #field_1_4,#field_2_3, #field_2_4, #field_5_3,  #field_4_9, #field_4_57, #field_5_4, #field_6_3, #field_6_4,#field_6_5, #field_6_6, #field_6_7, #field_6_11, #field_6_21, #field_6_58 {width:50%;}
    
    #field_4_3, #field_4_4, #field_4_56 {width:30%;}
    
    #field_1_3, #field_1_4,#field_2_3, #field_2_4, #field_4_3,#field_4_4, #field_4_6,#field_4_7,#field_4_8,  #field_4_9, #field_4_56, #field_4_57, #field_4_58, #field_5_3, #field_5_4, #field_6_3, #field_6_4, #field_6_5, #field_6_6, #field_6_7,  #field_6_11, #field_6_21, #field_6_58 {height:75px;}

    Thanks in advance for your help.

    Posted 14 years ago on Monday April 19, 2010 | Permalink
  2. You are going to have a difficult time accomplishing this because drop down fields take up as much space as the longest item in the drop down. The Fondo drop down field on this form has some long values, which means it's going to be difficult to arrange the form the way you want it.

    Posted 14 years ago on Monday April 19, 2010 | Permalink
  3. Cheo
    Member

    Thanks Carl.

    But if I change the size to a smaller one, can it be easy?

    For example with the first 3 fields I have some difficult, and they are no drop down fields.

    Thanks

    Posted 14 years ago on Tuesday April 20, 2010 | Permalink
  4. You would have to do everything with CSS. Including setting the size of the fields. You are going to have to be very careful with the CSS otherwise you are going to run into problems with formatting (especially cross-browser). In order to change the size of the form field inputs themselves you need to target the inputs and not just the field container.

    Posted 14 years ago on Tuesday April 20, 2010 | Permalink