How to make Miro (embedded iframe) appear full page width?

Site URL: https://www.laforesta.co/traces-from-the-trails

Hi CSS experts:)

I am trying to set the width of my iframe to go the whole page length, but it seems to be only going so far left and right.

My embed code is <iframe width="1000" height="600"  style="max-width:100%" src="https://miro.com/app/live-embed/o9J_lHgdmb0=/?moveToViewport=269838,-79193,270959,182766&embedAutoplay=true" frameBorder="0" scrolling="no" allowFullScreen></iframe>

Looking through some advice on this forum, I ended up inserting this code into Design > CSS:

div#block-yui_3_17_2_1_1630068565273_6716 .sqs-block-content {
    display: flex;
    justify-content: center;
  padding-left: 0;
    padding-right: 0;
     width: 100% !important;
}

It does a good job of centering the iframe, but I still can't have it full page width...

Does anyone have any ideas?

Thanks in advance!

Enéa

I think that your embed is probably not the issue. The CSS looks OK, although you probably don't need it, you can just put the width in the iframe code as "100%". I think you just need to edit the content width of your section in the squarespace editor and change it to Large rather than Medium. 

you may need the css for the padding as I think the embed will put in a padding of 17px by default, but that is consistent with other blocks, so try editing the content width first. 

Thanks for looking into it Dave!

I'm afraid I am using a 7.0 template, which does not offer me content block size editor options you refer to...

@aimdavehart 

Hey @Enea, it's not a specific feature, where you have the embed code, change the 1000 to 100%

<iframe width="1000" height="600"  style="max-width:100%"

Thanks Vigasan. I applied this into the embed code, but don't see any difference...

I figured it out - in SQS7.0 it's in the Design > Site Styles section where I could influence the content block width, and this allowed my Embed block to go wide as well

Thanks for your support