lindm Posted August 23, 2008 Share Posted August 23, 2008 I am combining a div setup with an iframe but the iframe gets cutoff corresponding to the height of the top menu. No clue to why. Please see 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> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <title>Untitled Document</title> <style type="text/css"> <!-- html, body{height:100%; background: #2756A2 url(bilder/xbody_bg.png) repeat-x top center; } * html #container{ /*IE6 hack*/ height: 100%; width: 100%; } body{ margin:0; padding:0; overflow: hidden;/*No scroll*/ } #container { width: 820px; /*Width of main container*/ margin: 0 auto; /*Center container on page*/ height:100%; } #left { float: left; width: 20px; background-image:url(bilder/xleft.png); background-repeat:repeat-y; height:100%; } #middle { margin-left: 20px; margin-right: 20px; height:100%; background-color:#FFFFFF; } #logo { background-image:url(bilder/xtopmenu.png); background-repeat:no-repeat; height:65px; width:100%; text-align: right; vertical-align: bottom; } #main { height:100%; width:100%; padding:0px; } #right { float: right; width: 20px; background-image:url(bilder/xright.png); background-repeat:repeat-y; height:100%; } #topmenu{ background-image: url(bilder/xmenu.png); background-repeat: repeat-x; background-position: left top; width:780px; height:23px; padding: 2px; } .menu1{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; font-weight:normal; color: #FFFFFF; vertical-align: bottom; padding: 6px; } .px10{ font-size:10px; } --> </style> </head> <body> <div id="container"> <div id="left"><img src="bilder/xlefttop.png" width="20" height="252"></div> <div id="right"><img src="bilder/xrighttop.png" width="20" height="252"></div> <div id="middle"> <div id="logo"> </div> <div id="topmenu"> </div> <div id="main"> <iframe height="100%" width="100%" src="http://www.dmi.dk" frameborder="0"></iframe> </div> </div> </div> </body> </html> Any ideas to why much appreciated. Tested on Safari 3 and Firefox 3 Quote Link to comment https://forums.phpfreaks.com/topic/121003-iframe-and-div-lower-part-of-iframe-cutoff/ Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.