Remove border on a specific field

hello searched and haven’t found anything useful that works. I am trying to target just one form field that is to attach an image. It does not need a border like the rest of the fields have. I have tried this code after wtching a video… does’nt do anything.

.gform_wrapper .gform_body .gform_fields #field_23_1.gfield {
        border-top-style: hidden !important;
        border-right-style: hidden !important;
        border-left-style: hidden !important;
        border-bottom-style: groove !important;
        background-color: #eee;

Anybody know how to do this? I want to remove the border boxes on just certain fields… target an exact field for it’s own css properties.

The custom CSS you have should work and it should target the field with an ID 1 on a Form with ID 23. How are you currently adding the CSS to the website/form? You can insert the CSS within an HTML field on the form and wrap the CSS codes with the tags.

1 Like

I had the same issue.
My solution was to define a class gf_noborder for each field type (below) in style.css and simply add the class to each field as required.

body .gform_wrapper .gform_body .gfield.gf_noborder div input[type=text],
body .gform_wrapper .gform_body .gfield.gf_noborder div input[type=number],
body .gform_wrapper .gform_body .gfield.gf_noborder div textarea {
  border-style: none;
  background-color: #ffffff;
1 Like