Safari/Chrome (Webkit) - Cannot hide iframe vertical scrollbar

css iframe safari webkit scrollbar
BrainCore picture BrainCore · Nov 7, 2009 · Viewed 98.2k times · Source

I have an iframe on www.example.com that points to support.example.com (which is a CNAME to a foreign domain).

I automatically resize the height of my iframe so that the frame will not need any scrollbars to display the contained webpage.

On Firefox and IE this works great, there is no scrollbar since I use <iframe ... scrolling="no"></iframe>. However, on webkit browsers (Safari and Chrome), the vertical scrollbar persists even when there is sufficient room for the page without the scrollbar (the scrollbar is grayed out).

How do I hide the scrollbar for webkit browsers?

Answer

Tim picture Tim · Dec 4, 2009

I just ran into this problem, and discovered that the fix was to set overflow: hidden on the HTML tag of the page inside the iframe.

Related questions

How to make iframe work properly in iOS safari

I'm having trouble with displaying a Bootstrap responsive page inside an iframe in iOS safari browser. It works fine in Android Chrome. In one of the iframes, the page loses its responsiveness and doesnt even scroll (horizontally as well as …

Read More
How to apply CSS to iframe?

I have a simple page that has some iframe sections (to display RSS links). How can I apply the same CSS format from the main page to the page displayed in the iframe?

Read More
Remove border from IFrame

How would I remove the border from an iframe embedded in my web app? An example of the iframe is: <iframe src="myURL" width="300" height="300">Browser not compatible.</iframe> I would like the transition from the …

Read More