Iframe scrolling / overlow - disable scrollbars

I’ve added both the deprecated scrolling attribute to the iframe as well as the CSS overflow attribute set to hidden on iframe and div but the frame still loads with scrollbars.

I’m trying to determine if there is an interaction with the iframe and Pro theme (3.2.2) or something from the iframe code itself.

I’ve attached the page in the secure note and would be very thankful if I could narrow this down to a Pro issue or my iframe code.

Thanks much.

Hello @wbgTHEMECO,

Thanks for writing in!

I have checked your site and I do not see any scrollbars in your iframe.

Please check your browser caches and clear it before testing your site.

That’s odd. I’ve clear the cache and viewed the page in Incognito.

I’m curious, were you looking at the page in Firefox, Chrome or some other browser?

What I see in both FF and Chrome is a double scrollbar on the right side of the browser window.

Hey @wbgTHEMECO,

I checked your setup and there is an iframe added in your site which has the inline style position: absolute; which is causing the issue, removing the position property removed the double scroll bar.

If this is the iframe you’ve added then remove the position property to fix the issue.

Let us know how this goes!

Okay, I tried removing the position style but that makes the content piece render as a single viewable page, so it’s very tiny.

I’ll need to find the conflicting CSS for that.

Thanks for pointing me in the correction direction.

Interesting. By a mistake, I left in the padding on the section on a page that contained the code. The scrollbars disappeared!

So I went back to that original page in this post, set top padding on the section to 0 and the bottom padding to 1em and the scrollbars disappeared.

Unexpected result but whatever it’s doing, I’m glad the scrollbars are gone.

We’re glad you sorted it out.

Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.