html - Get Iframe to fill to bottom of page -



html - Get Iframe to fill to bottom of page -

this seems should simple question cannot seem find solution anywhere.

on website making have navigation bar @ top of page 43px in height , in effort not have edit each individual page create did set iframe below @ 100% width navigation buttons targeting source of iframe.

now run issue want iframe extend bottom of navigation bar bottom of page cannot tell iframed in if set height 100% set height of entire page , adds 2nd scrollbar compensate 43px @ bottom, how can fit iframe remaining space below nav bar ?

i have tried setting different % not work different res monitors. , need work cross browser (in ie, chrome, safari, , mozilla, preferably in opera that's not necessity).

sorry little wordy, can help?

pretty simple. need subtract height of navigation current viewport height , set iframe's height. utilize javascript method:

function resizeiframe() { var nnavigationheight = 43; // assuming 43px stated above var nviewheight = document.body.clientheight; var niframeheight = nviewheight - nnavigationheight; document.getelementbyid("youriframeid").style.height = niframeheight + "px"; }

you'll need set body , html 100% height work.

body, html { height: 100%; }

i should mention dubious way of achieving want do, it's solution true letter of question. i'd recommend using jquery rather vanilla javascript cross-browser headaches minimised (i've tested code in current installations of ie 7 & 8, ff, chrome, , safari without issue, mileage may vary). if decide go route, improve take advantage of first-class , simple ajax functionality using div , dispense iframe entirely.

html css iframe

Comments

Popular posts from this blog

How do I check if an insert was successful with MySQLdb in Python? -

delphi - blogger via idHTTP : error 400 bad request -

postgresql - ERROR: operator is not unique: unknown + unknown -