How to make width and height of iframe same as its parent div?

Question

I have a iframe inside a div. I want the size of iframe to be exactly the size of its parent div. I used following code to set the width and height of iframe.

<iframe src="./myPage.aspx" id="myIframe"      style="position: relative;              height: 100%;              width: 100%'              scrolling='no'              frameborder='0'"> 

But width of iframe is not same as div, also both horizontal and vertical scrollbar are displayed.

Answer 1

you have a lot of typos.

a correct markup should be like:

<iframe src="./myPage.aspx" id="myIframe" scrolling="no" frameborder="0"     style="position: relative; height: 100%; width: 100%;"> ... </iframe> 

also, if this frame already has an ID, why don't you put this in CSS like this (from a separate stylesheet file):

#myIframe {     position: relative;     height: 100%;     width: 100%;  } 

and HTML

<iframe src="./myPage.aspx" id="myIframe" scrolling="no" frameborder="0" > ... </iframe> 

mind that scrolling & frameborder are iframe attribute, not style attribute.