StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POhtml iframe query
text
Body
copied!<p>I have the following scenario:-</p> <p>In an html page, display a top bar followed by another html page included dynamically on to the lower part of the page (for which I've used an Iframe). So, scroll bars for the window as such should not come up. Instead, a scroll bar for the included page should come up. I could do this using an <code>overflow: hidden</code> property on the body of the page.</p> <p>But now, inorder to achieve this, i had to set the height of the iframe to 100% so that the page looks seamless. The problem with this is that the lower div which conatins the iframe flows out of <code><body></code> of parent and since I've given an <code>overflow:hidden</code> to the body, it cuts off the last bit of every included page. How do I overcome this?</p> <p>The code :-</p> <pre><code> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Show Asset</title> <style> html, body, iframe { height: 100%; } body { overflow: hidden; margin: 0px; } iframe { width: 100%; margin: 0px; border: 0px; padding: 0px; } .optionsBar { background-color: Lime; } .iframeHolder { /* height: 100%;*/ } </style> </head> <body> <div class="optionsBar">Test</div> <div class="iframeHolder"> <iframe frameborder="0" scrolling="auto" src="http://en.wikipedia.org/wiki/Main_Page"></iframe> </div> </body> </html> </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload