[Michael JParticipant]

Hello, we have a few websites in our organization and i’m looking to have them all accessible through our main site.

Using I frame to get the job done and seems to work nicely, except for an issue of padding. There’s a top padding of 40… how can I get rid of this padding?

Also, it creates an issue of dual scrolling windows that can be a bit confusing (if you’re to the left or right of the iframe, in the whitespace, it scrolls the main site, if you’re inside the iframe it scrolls the iframe. This seems to be created by extra space on the side that isn’t registered (at least via inspect this element) as padding on the iframe. Is there anyway to disable the main site scrolling on this page and only have the iframe scroll?

http://www.openequalfree.org/teachbuzz

[ZeshanMember]

Hi Micheal,

Thank you for writing in!

To remove the padding, add the following CSS code under Custom > CSS in the Customizer:

.page-id-77 .x-content-band {
   padding: 0;
}

Regarding the double scrollbars, the iframe has been given a height of 1600px, that’s the reason it’s showing scrollbar on body of the page. You can try the following CSS code to remove it:

html, body {
   overflow-y: hidden;
   height: 100%;
}

Hope this helps. 🙂

Thank you.

[Michael JParticipant]

That has fixed the top padding issue but the side padding and scroll bar are still there. How can I get it to fill the whole body smoothly and look like part of the site?

Thanks!

Michael

[Michael JParticipant]

I see what happened. That removed the sitewide scroll bar, not the iframe scroll bar. I want the site to still have a scroll-bar, i just want that iframe page to look like a single, cohesive unit. The iframe goes flush with the main page window and one scroll bar for the whole site, *on that page*

[ChristopherModerator]

Hi there,

Please add the following CSS code under Customize -> Custom -> CSS:

body.page.page-id-77 {
position: fixed;
overflow: hidden;
left: 0;
right: 0;
}

Change your page template to full width to remove padding from left side .More information on http://theme.co/x/member/kb/page-templates/.

Hope it helps.

[Author]

Posts