How to embed a Google Form that's actually responsive

Google Forms gives you an <iframe> to embed, but it hardcodes a pixel height. Width is easy - set it to 100% and it fills the container. Height is the problem. A fixed height either clips a long form or leaves a dead scroll area inside the frame, and it looks worse the smaller the screen gets.

The fix is a classic responsive-iframe wrapper: a container with intrinsic ratio padding, and an absolutely-positioned iframe filling it.

Step 1 - Wrap the iframe

Grab your form’s embed URL (the …/viewform?embedded=true link) and drop it into a wrapper div:

<div class="responsive-iframe-container">
  <iframe
    src="https://docs.google.com/forms/d/e/YOUR_FORM_ID/viewform?embedded=true"
    frameborder="0" marginheight="0" marginwidth="0">
    Loading…
  </iframe>
</div>

Step 2 - Add the CSS

.responsive-iframe-container {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 150%; /* tune this to your form's height */
  overflow: hidden;
}

.responsive-iframe-container iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

Step 3 - Tune the ratio

padding-bottom is the height as a percentage of the width. A short contact form might need 90%; a long survey might need 200% or more. Adjust until the form fits with no internal scrollbar and no big empty gap, then test on a real phone - not just your desktop browser’s responsive mode.

The honest caveat

This is a CSS aspect-ratio trick, so the form’s height scales with the container’s width. It works well when your form length is fairly stable. If your form’s height varies a lot (conditional questions that expand, validation messages), no pure-CSS approach is perfect - the iframe can’t report its own content height back to the parent page for security reasons. For those cases you’d need a JavaScript resizing library, or better, a native form on your own site so there’s no iframe at all.

For most embedded Google Forms, though, the wrapper above is all you need.

If you’d rather have a fast, native form that captures leads straight into your own system - no iframe, no Google branding - that’s the kind of thing we build.