Contact Form Widget adds scrolling on mobile devices

  • Issue description:

  • Link to the page with the widget in question:

Hi,

My Contact Form widget shows up fully displayed with no scrolling required in my desktop browser, but when I go to my website (a Google Sites website) on my mobile phone, it shows just the Title and Caption with a scroll bar on the right side. I am worried that user will not know that its a form to fill out and ignore it.

I tried inserting the custom CSS code:

@media (max-width: 480px) {
[class*=“Banner__Container-sc”]>[class*=“WidgetBackground__Container-sc”] {
height: auto !important;
}
}

but it had no effect on the mobile version.

The only solution that I came up with, is to extend the bottom edge of the widget to make it very long, so that when Google Sites computes the height for the mobile version, it displays the whole form. This works, but it makes the desktop version ugly, as there is a ALOT of empty space between the form and the footer.

website: https://www.galtinvestment.com

Thanks

1 Like

Hi there, @Greg_A :waving_hand:

Due to the peculiarities of the Google Sites platform, all elements of applications are being converted into iframe format, which causes incorrect displaying. I am really sorry :pensive_face:

The iframe calculates the height of the block on mobile based on its size on desktop. So, the workaround you’ve followed is correct, and it’s the only possible solution for now.

I hope this explains things.

If you have any questions left or any assistance is needed, we’re always here to help :slightly_smiling_face: