Edit Question - KnowledgeHub

Title Body

There are quite a lot of questions regarding iframe and it's height. Some are similar but not giving me the right answer. So let me explain my case: JSFiddle: http://jsfiddle.net/AmVhK/3/show/ Editor: http://jsfiddle.net/AmVhK/3/ There is a table with 2 rows. First one contains a div #toolbar with fixed height. Second row contains a div which holds an iframe. I need the iframe to take the available space below the toolbar div. Problem I am facing is in IE standards mode (supporting IE8+). Let's say , the height of the window is 1000px and height of toolbar is 200px, then the height of the iframe is also 1000px and so has scrollbars. I need the iframe to have height of (page height-toolbar height). It would be good if there is a CSS solution. Using JavaScript to get the height available and setting it to the iframe or it's containing div is the last resort solution for me :) Setting the toolbar or iframe to absolute position also won't work for my use case. Markup change is ok if necessary (if you want to remove tables) I have already set the following CSS: html, body {height: 100%} Any good solution to implement it.

Tags (comma-separated) Cancel