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.

Adding a label outside of a radio button list row unique to that row

  1. matsilva

    I am looking to find a solution for creating a radio button list used for different products in a grid style format but I need to place a label outside of each row in that list.

    For example I have 4 columns of radio buttons that I have styled into columns using your CSS ready classes. However each of these rows needs a label to identify what you are choosing because they are price choices for a product field.

    Here is a link to an example

    as you can see the size labels are to the left of the row denoting the hierarchy of choices in the list.

    Is there any way to achieve this in gravity forms?

    Posted 9 years ago on Monday October 29, 2012 | Permalink
  2. This should be pretty simple.. just left float the label element for each field. You can set a width on the label to keep the alignment consistent and may need to tweak margins, padding, etc. depending on your application and theme styles.

    here's a quick example..

    body .gform_wrapper ul#gform_fields_22 li.gfield .gfield_label {


    Posted 9 years ago on Monday October 29, 2012 | Permalink
  3. matsilva

    Is this using 1 field list instead of separate ones for each row? I am asking because you wrote "label element for each field". What I am trying to avoid is the ability to tick more than one radio button by keeping all of these choices in 1 radio button field list.

    Current the field labels for each row are unique to 1 field and you can't display multiple labels within 1 field list, only next to the radio buttons themselves.

    Posted 9 years ago on Monday October 29, 2012 | Permalink
  4. matsilva

    After reading my description I think I need to clarify that this is doable when you have multiple radio button fields stacked on top of each other in rows. That isn't what I am looking for because you can click on more than one radio button option (1 per row).

    I am trying to avoid that so that I have a large grouping of radio buttons for different prices like my image example that match up to different size but you can only click on 1 radio button option. Each of the rows is organized to match up with a label but Gravity Forms doesn't seem to allow an extra label outside of a "faux" row created using the CSS ready clases.

    Posted 9 years ago on Tuesday October 30, 2012 | Permalink
  5. Mat, I am going to close this topic and concentrate the support on the other topic of yours with a similar request:

    Posted 9 years ago on Wednesday October 31, 2012 | Permalink

This topic has been resolved and has been closed to new replies.