Remove excess padding from embedded form

I've created a form and have it embedded on my privately-hosted WordPress site and I'm having a tricky issue with some excess padding.

To embed the form I am using:

<script src="https://form.jotform.com/jsform/62691157993166" type="text/javascript"></script>

The CSS I'm already using in the form's CSS designer is this:

form.jotform-form{ padding: 0; } div.form-all{ width: 100%; }

And that takes care of most of the padding issues, width, border, etc, etc and it looks 95% like what I want, but there's still some excess padding on all four sides of the form that I'd like to eliminate.

My form is currently at: https://somethinghappened.tech/contact-test/ and if you compare it to another page on my site, say the services page here: https://somethinghappened.tech/services/ you will notice the difference in padding.

Any ideas?  Thanks.

I have checked both your "contact-test" and "services" page and have not found any forms in it. I believe you're working with it and you removed it temporarily. Please let us know once the forms are back so we will be able to make some tests and apply the necessary solution to your issue.

By the way, can you try using the iframe code of your form instead of the normal embed script when you embed your form to your website?

We will wait for your response. Thank you.

Ah, sorry the test page was unpublished, it's there now.

And there is no form on the services page, I'm just providing that as an example so you can compare where and how the text aligns to demonstrate the issue of the extra padding.

I just tested using the iframe and the positioning and sizing is the same.

I'm not sure how would you like your form in your website to look exactly, but the padding that you're noticing are part of each field

which can be removed by adding the CSS codes below to your form.

.form-line {

    padding: 0px !important;

}

Or, if you only want the excess spaces around the form to be removed, you can try to add the following codes below instead.

li#id_3 {

    padding-top: 0px !important;

}

li#id_11 {

    padding-bottom: 0px !important;

    padding-top: 0px !important;

}

.form-line {

    padding-left: 0px !important;

    padding-right: 0px !important;

}

If, in any case, I have misunderstood your requirements, please feel free to let us know and give us more details.

Thank you.