Editor and saved page not the same?

Site URL: https://www.bb.fund/results

Hi There,

I have a page with a bunch of iFrames on it https://www.bb.fund/results 

The problem i'm having is that in the editor view these look perfect (and yesterday they were) but when i hit save or preview in another browser they are all over the place (especially section 2) 

I've tried creating a new page from scratch and the same thing is happening

the iframes themselves are all super simple, see an example below:

<iframe style="background-color:LightGray;"src="//www.fxblue.com/fxbluechart.aspx?c=ch_accountrisk&id=260014762" frameborder="0" width=100% height=200></iframe>

so i'm not sure where i'm going wrong

full disclosure: this morning i was adding code blocks to try and remove clicks on these, that didn't work and finally worked it out with a CSS injection and i have deleted all the old code and double checked that its gone?!?!? can Squarespace get ghost code lingering about?

This partly has to do with the way Squarespace defaults to using relative units for dimensions. The code block defaults to a size that fits the content in a row or column.

The first image you've shared displays "Our Results" and a properly sized iframe because It's filling the other half of the section. It's looking like a 50/50 split in the first section.

Following that section you have a new section with "Our Charts." That first line of the section fills the entire width of the section, give or take the padding left and right, and signals that "Hey, this text block is full-width, everything else should be this wide too!". So when you put your three iframes in the following row, it'll calculate 100/3 = 33.33333%. Since your iframes are set at a 100% width, it means that it will fill 100% of the 33.3% width of the block, which is relative to the entire width of the page set by your "Our Charts" block. Without the block, it'll just assume that each row should be 100% and then order your items automatically.