Create common scrolls for two iframes

Create common scrolls for two iframes

Hi,


<div id="divMain"> <div id="divChildOne" style="float: left; width: 50%;"> <asp:Label runat="server" ID="lableOne" Font-Bold="true"></asp:Label> <br /> <iframe id="iFrameOne" runat="server" style="width:100%;" /> </div> <div id="divChildTwo" style="float: right; width: 50%;"> <asp:Label runat="server" ID="labelTwo" Font-Bold="true"></asp:Label> <br /> <iframe id="iFrameTwo" runat="server" style="width:100%;" /> </div> </div>
This is the design of my page where i want to show to docs side by side.

Now what i want to create is two scroll bars , one vertical and the horizontal and when i scroll anyone of them, both docs will scroll at the same time.

I though of giving the "divMain" "overflow:auto" property and overflow:hidden to rest of the other controls. But when i run there are scrollbars for the iframe. The scrollbar belongs to a div inside the iframe having a id xxxx.

i don't know where the div came from. May be the its with in the doc that i am showing which is an infopath report.


What shall i do 


I was able to hide the scroll bars and eventhough i have given the overflow of divMain to scroll, it is disabled.



I gave the parent div maxheight ( which i dnt thnk is nice due to resolution issue) , now scroll came for height.

Now i want the child control (iframe) content to get scrolled as i scroll the main div scroll

Thanks in advance


Arjun Menon