How to delete borders with CSS codes?

How can I delete all these lines in my form? only keeping the field lines.

https://www.jotform.com/build/250437815523860

Hi brandapw,

Thanks for reaching out to Jotform support. You would like to delete the border from the form. It’s easy to fix, just follow these steps:

1 - In the Build section, click on the blue Paintbrush icon.

2 - At the end of the Form Designer column, click the blue Advanced Designer button.

3 - In the right column, click the CSS button. Add the following code at the end of the text:

.form-all { 

border: none !important; 

box-shadow: none !important; 

} 

4 - After making the changes, click Save Changes in the left column, below the pencil icon.

5 - Once saved, click on the Pencil icon. Now you can test it!

Check this guide to know more about How to Custumize your Form Using Custom CSS Codes.

Reach out again if you have any other questions, give it a try and let us know!

Hi Fatima,

Thanks for reaching out to Jotform Support. We can remove the lines you've indicated using a few CSS codes. Let me show you how:

1. First, copy this code:

/* remove borders - 24171721*/

.form-all {

border: none !important;

box-shadow: none !important;

}

#cid_99 > div {

  border-top: none;

}

/* Ends here */

2. Next, in Form Builder, click on the Paint Roller icon on the right and click on the Styles tab on the Form Designer menu.

3. Then, scroll down to the Inject Custom CSS box and paste the codes there.

This is how it would appear when published:

That's it. Feel free to test this cloned demo form or clone it to your account to inspect it further. We also have a guide on How to Inject Custom CSS Codes that you can check out.

Give it a try and let us know if you need any help.

perfect! thank you.