I have an initial page with something like this:
<body>
<iframe src = "page1.html" style="position:fixed; width:100%; height:100px; left:0; top:0 overflow:hidden"</iframe>
<iframe src = "page2.html" style="position:fixed; width:100px; height:100%; left:0; top:100px; overflow:hidden"></iframe>
<iframe src = "page3.html" style="position:absolute; width:100%; height:100%; left:100px; top:100px; overflow:scroll"></iframe>
</body>
Basically, page1 is the title, page2 is the menu on the left and page3 is the content.
I would like to make page1 and page2 fixed without any scrollbars but only have scrollbars on page3.html. The above code displays two scrollbars, one for the whole body and another for page3.html I do not want 2 scrollbars but only one, and when I add
<body style="overflow:hidden">,
the scrollbar for page 3 is also hidden. I tried using (overflow:scroll !important) but did not work. Is there any way to do this elegantly?