Jump to content

Make an iframe fill the width of the banner

Go to solution Solved by tuanphan,

Recommended Posts

This CSS style would make it fill everything although it could affect other blocks on the page as well. Doesn't hurt to try I guess though.

 

Make sure to just embed on the specific page where it is needed.

 

div#block-yui_3_17_2_1_1583366649920_4403 {
    width: 100% !important;
}

.Index-page-content.sqs-alternate-block-style-container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

 

Link to comment
  • Solution
On 3/16/2020 at 2:44 AM, Claire_auck said:

@JayShops
Sadly the code was messing with the rest of the site, it was a good try though! 
I will ask the developers of the iframe if they can adjust at their end.

Thanks for trying!

section#new-page .Index-page-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0;
    padding-right: 0;
}
div#block-yui_3_17_2_1_1583366649920_4403 {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
17 hours ago, tuanphan said:

section#new-page .Index-page-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0;
    padding-right: 0;
}
div#block-yui_3_17_2_1_1583366649920_4403 {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

 

@tuanphan This works a treat....thank you soooooo much!
You have helped me out so many times, I'm super grateful....!!! 
Cheers
Claire.

Link to comment
  • 11 months later...

@Claire_auck where are you putting these code snippets in to affect the iframe width? I've got the same issue, but I don't know how to use the solutions mentioned here. I tried doing it via page settings > advanced > inject custom code, but that doesn't seem to be the right way. In my case, the iframe I'm embedding doesn't have any of its own settings for size, so I need to find a way to fix it on the Squarespace side.

Link to comment
  • 2 weeks later...
On 3/13/2021 at 6:01 AM, alanna-oc said:

@Claire_auck where are you putting these code snippets in to affect the iframe width? I've got the same issue, but I don't know how to use the solutions mentioned here. I tried doing it via page settings > advanced > inject custom code, but that doesn't seem to be the right way. In my case, the iframe I'm embedding doesn't have any of its own settings for size, so I need to find a way to fix it on the Squarespace side.

Add to Design > Custom CSS. If it still doesn't work, can you share link to page where you inserted iframe? We can help easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.