Jump to content

responsive iframe to fill section

Recommended Posts


I'm trying to get an iframe to fill a full section on a page for a client website.

At the moment it seems to be full width, but at a small height.

I've added the below to the CSS (which made it full width), but can't seem to get the height to change.

The iframe has a built in responsiveness so it changes to mobile version on small screens, so I'd like it to fill the section on both desktop and mobile.

Happy for it to have some white space around if needed (as is at the moment).

Page: https://www.sdaservices.com.au/eligibility-tool

CSS used currently:

#block-yui_3_17_2_1_1674441724084_27722 .sqs-block-content {
  height: 100% !important;

#block-yui_3_17_2_1_1674441724084_27722 iframe {
  top: 0;
  left: 0;
  height: 100% !important;
  width: 100% !important;

Thanks in advance 🙂


Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.