Home/ Questions/Q 582151
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T14:39:23+00:00

How can I make my iframe fill the window and not display any scrollbars?

  • 0

How can I make my iframe fill the window and not display any scrollbars?

This works for IE6, I would like to get it to work for all browsers if possible:

<iframe name=iframe1 src="theSiteToShow.html"  width="100%" height="100%" frameborder="0" marginheight="10" marginwidth="10"></iframe>
<script type="text/javascript">
function resizeIframe() {
    var height = document.documentElement.clientHeight;
    height -= document.getElementById('frame').offsetTop;

    // not sure how to get this dynamically
    height -= 20; /* whatever you set your body bottom margin/padding to be */

    document.getElementById('frame').style.height = height +"px";

};
document.getElementById('frame').onload = resizeIframe;
window.onresize = resizeIframe;
</script>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You should be able to do this using CSS only, without any need for javascript. The following works for me in IE6+, Google Chrome and Safari:

    <style type="text/css">
body {
   margin: 0;
   overflow: hidden;
}
#iframe1 {
    position:absolute;
    left: 0px;
    width: 100%;
    top: 0px;
    height: 100%;
}
</style>

<iframe id="iframe1" name="iframe1" frameborder="0"  
     src="theSiteToShow.html"></iframe>

    Your frame margins should be set in the body of theSiteToShow.html.

    UPDATE
    Following your comment, I used the following as a test page:

    <html> 
<head>
<style type="text/css">
body {
   margin: 0;
   overflow: hidden;
}
#iframe1 {
    position:absolute;
    left: 0px;
    width: 100%;
    top: 0px;
    height: 100%;
}
</style>
</head> 
<body> 
<iframe id="iframe1" src="http://stackoverflow.com" frameborder="0"></iframe>
</body> 
</html>

    Tested in IE6+, Chrome, Safari and Firefox, it works just fine and fills the entire window.

    • 0