Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

IFrame scroll bars not coming on Chrome

I am using an IFrame to make show some content from some other domain. The problem is that I can use a specified height and width (which I am using) and the content inside the IFrame cannot be accommodated completely in the IFrame. Hence, I need scrollbars.

I used the following html code -

**<iframe style = "overflow-x:scroll; overflow-y:scroll;" src =       "http://shopsocial.ly/merchant/fanpage?merchant_name=cafepress"
     height = "400" width = "500">**

This works fine in Firefox. But in Chrome I'm not getting any scrollbar in the IFrame. I have searched this problem and have tried many things all of which did not solve my problem. Can someone help me with this?

like image 433
Siddharth Avatar asked Jun 01 '11 10:06

Siddharth


3 Answers

In your iframe content add inline:

<body style="overflow:auto;">

or in the css file attached to the iframe

html, body {
   overflow:auto;
}

and of course as recommended by Tom make sure you use scrolling="yes" and style="overflow:visible;" on the iframe:

<iframe scrolling="yes" src="http://example.com" style="overflow:visible;"></iframe>

If it still does not work then try to wrap the iframe like this:

<div style="overflow:visible; height:400px;">

    <iframe scrolling="yes" src="http://example.com" style="overflow:visible; height:2000px;"></iframe>

</div>
like image 151
RafaSashi Avatar answered Oct 09 '22 13:10

RafaSashi


Instead of using the CSS style you could use the scrolling property of the iframe and set it to yes (i.e. always display scrollbars):

<iframe scrolling="yes" src="http://domain.com" height="400" width="500"></iframe>
like image 35
Tom van Enckevort Avatar answered Oct 09 '22 13:10

Tom van Enckevort


Yap Tom is absolutely right you can use

<iframe style="overflow:visible; width:400px; height:400px;" frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" src="yourfile.html"></iframe>

and it should be work as i have tested.

If it still does not work then update Chrome to latest version. :)

like image 44
PHP Ferrari Avatar answered Oct 09 '22 13:10

PHP Ferrari