Remove extra spaces on the form when viewed on mobile devices

Hi -- Is there a way to reduce the excess space in this form (#82387506281158)? See attached screenshot (on our mobile site)?

Thanks in advance.

Alex

Hi give2kids,

Thank you for reaching out to Jotform Support. You can remove the excess space on your form by injecting custom CSS codes and changing the form color . As a workaround, I made the background transparent so it would be the same with the background color so it looks like there are no extra spaces. This should apply when the form is embedded or viewed on mobile devices as well. Here's how to do it using the cloned version of your form:

1. Copy the custom CSS codes below:

.form-all{

 background: transparent;

 box-shadow: none !important;

}

2. In Form Builder, click on blue roller paint icon.

3. Go to Styles.

4. And scroll down and paste the custom CSS codes in the CSS text editor.

Next, change the form color:

1. In Form Builder, click on the blue roller paint icon.

2. Go to Form Color and remove the color code.

3. Then paste this #c3d0ec color code into it.

Here's the result:

Give it a try and let us know how it goes.

Hi Aries,

Thank you for your reply -- but I'm confused.

The final result you provided looks exactly like my current form (with that extra space on the bottom).
In other words -- there is zero improvement.

Please explain what I'm missing.

Alex

Hi Alex,

Please try using the codes below to embed your form on your website:

    <iframe

id="JotFormIFrame-82387506281158"

title="Mobile Form"

onload="window.parent.scrollTo(0,0)"

allowtransparency="true"

allow="geolocation; microphone; camera; fullscreen"

src="https://form.jotform.com/82387506281158"

frameborder="0"

style="min-width:100%;max-width:100%;height:270px;border:none;"

scrolling="no"

>

</iframe>

<script src='https://cdn.jotfor.ms/s/umd/latest/for-form-embed-handler.js'></script>

<script>window.jotformEmbedHandler("iframe[id='JotFormIFrame-82387506281158']", "https://form.jotform.com/")</script>

The updated code includes styling which reduces the spacing of the iFrame. Here's how it would appear:

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