Form Body CSS Selectors

Container

Contains the main form content

  • example: the form body section (div) – applies to all forms
body .gform_wrapper .gform_body  {border: 1px solid red}
  • example: the form body section (div) – applies just to form ID #1

  • body #gform_wrapper_1 .gform_body {border: 1px solid red}
    

    Field List

    Container

    unordered list used to structure all of the form elements

    • example: the form list container (ul) – applies to all forms
    body .gform_wrapper .gform_body .gform_fields {border: 1px solid red}
    
  • example: the form list container (ul) – applies just to form ID #1

  • body #gform_wrapper_1 .gform_body .gform_fields {border: 1px solid red}
    

    List Items

    Individual list items containing each form element

    • example: the form list item (li) – applies to all forms
    body .gform_wrapper .gform_body .gform_fields .gfield {border: 1px solid red}
    
  • example: the form list item (li) – applies just to form ID #1

  • body #gform_wrapper_1 .gform_body .gform_fields .gfield {border: 1px solid red}
    

    Field Inputs

    Input Container

    Wraps the actual form element inside the containing list item

    • example: input field container (div) – applies to all forms
    body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container {border: 1px solid red}
    
  • example: input field container (div) – applies just to form ID #1

  • body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_container {border: 1px solid red}
    
  • example: input field container (div) – applies just to specific form field (based on the unique parent element ID – replace “XX_X” with your actual element ID)

  • body .gform_wrapper .gform_body .gform_fields  #field_XX_X.gfield .ginput_container {border: 1px solid red}
    

    Description Container

    Contains the field description inside the containing list item

    • example: input field description container (div) – applies to all forms
    body .gform_wrapper .gform_body .gform_fields .gfield .gfield_description {border: 1px solid red}
    
  • example: input field description container (div) – applies just to form ID #1

  • body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_description {border: 1px solid red}
    
  • example: input field description container (div) – applies just to specific field description (based on the unique parent element ID – replace “XX_X” with your actual element ID)

  • body .gform_wrapper .gform_body .gform_fields  #field_XX_X.gfield .gfield_description {border: 1px solid red}
    

    Required Field Indicator

    • example: required field indicator (span) – applies to all forms

    body .gform_wrapper .gform_body .gform_fields .gfield .gfield_label .gfield_required {color: red}
    
  • example: required field indicator (span) – applies just to form ID #1

  • body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_label .gfield_required {color: red}
    
  • example: required field indicator (span) – applies just to specific indicator (based on the unique parent element ID – replace “XX_X” with your actual element ID)

  • body .gform_wrapper .gform_body .gform_fields  #field_XX_X.gfield .gfield_label .gfield_required {color: red}