Menu
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.
210
You can use the JavaScript contentWindow property to make an iFrame automatically adjust its height according to the contents inside it, so that no vertical scrollbar will appear.
To get the iframe to properly use 100% the parent needs to be 100%. In newer doctypes the html and body tag are not automatically 100%. When I added height:100% for html and body then it worked flawlessly.
Approach 1: For adding additional div's in an iframe, you need to use a wrapper div, that wraps the contents of your intended div and the iframe into one unit. This way you can display the contents of your div along with the iframe embedding to the document/webpage.
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.
89
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
