Hi,

 

I built a website for a charity which uses a Just Giving widget. The iframe is tricky, as it needs a lot of space as you go through the process of the donation, so the I have needed to limit the dimensions of it on the initial page so it doesn't push all the other content to the bottom of the page (you can view the page here:

http://www.virtualdoctors.org/support-us/ )

 

The widget is placed inside the page using the following code:

 

[iframe class="giving"
src="https://www.justgiving.com/virtualdevelopmentuk/donate/?targetdevice=embed&theme=iframe&utm_source=website_cid235222&utm_medium=givingwidget&utm_campaign=donation"
width="573" height="440"]
 

 

The css I use to make sure that the scrollbar is displayed is:

 

iframe.giving {overflow-x: hidden; overflow-y: scroll !important;}

 

It works on Firefox, but not on the others. I have tried loads of variations, and I can't find a solution. I'd be really grateful if anyone had any ideas.

 

Many thanks

 

Vicky

Hey Vicky,

 

Put your iframe in a div and apply overflow-y:scroll there.

 

Gopal Juneja

Hi!

 

You have just to add to your iframe

scrolling="yes"

Edited November 23, 201312 yr by saymar90

 

You have just to add to your iframe

scrolling="yes"

 

Also, sorry you should remove the height property from iframe and add this in css

iframe.giving {
min-height: 440px;
}