How to make iFrame scroll with the background?

Question

I have designed a WebPage in which I am using an Image that fills the background
and I am using an iFrame which actually has the contents in it.
I have placed it in a way that background image is like a border to the main content (iFrame).
Now, the problem is that when I scroll the iFrame, background stays stationary and when I scroll the background, iFrame stays stationary.
I want to scroll both together;
or if there is a way that background does not scroll at all and iFrame scroll with the Browsers main scroll bar that is intended for the Web Page.
Any suggestion or advice would be highly appreciable!
Thank you!

Answer 1

why are you using the iframe? are you looking for something like this fiddle? This will allow the main content to scroll with the background still:

html: css:

body {
    background: url(images/full_screenBgImage.jpg) no-repeat transparent;
    background-attachment: fixed;
    background-position: bottom left;
}
#mainContent {
    background-color: white;
    padding: 10px;
    width:50%;
    margin:20px auto;
}