Embedding MS Form iframe scrolling="no" does not work

Question

I am trying to embedthis MS Form into SquareSpace but I get 2 scroll bars in the page (one for browser and one for this form).

<iframe width="460px" height= "1000px" scrolling="no" 
src= "https:...&embed=true" 
frameborder= "0" marginwidth= "0" marginheight= "0" style= "overflow:hidden; border: none; max-width:100%; max-height:100vh" 
allowfullscreen webkitallowfullscreen mozallowfullscreen msallowfullscreen> </iframe>

I was wondering if there is a way to remove the scrollbar for the form and have only the browser scoller? Obviously the page gets a longer scroll depending on size of the form in each step

Thanks a lot in advance

score 0 · Answer 1 · answered Jun 15 '20 at 04:17

0

Yup, add this attribute to your iframe:

scrolling="no"

example:

<iframe src="http://iFrameSource.com"  scrolling="no" style="width: 550px; height: 500px;  overflow: hidden;" ></iframe>

Source: Remove scrollbar from iframe

answered Jun 15 '20 at 04:17

Michael Romrell

1,026
5
15
31

Thanks, I've tried that too! Doesn't work! Not sure why. I noticed the code doesn't show. Here is my code: – Sia Jun 15 '20 at 04:20
– Sia Jun 15 '20 at 04:20

score 0 · Answer 2 · answered Jun 15 '20 at 04:39

You can do it by adding following CSS.

<style type="text/css">
  body {margin:0; overflow: hidden;}
  iframe {border: none;}
</style>
<body> 
  <iframe height="100%" width="100%" 
   src="yourframe1.html"></iframe>
  <iframe src="yourframe2.html" 
   width="100%" height="100%"></iframe>
</body>

Embedding MS Form iframe scrolling="no" does not work

2 Answers2