About IFRAME in ie11 height:100% void of pit

Source: Internet
Author: User

OK, today the company assigned a solution to solve the bug in IE task, one of which is the height of the iframe 100% does not take effect;

At first, because I really did not know how to understand the IFRAME this goods, so, online search a lot of information about this goods, to the end, found no eggs, no problem to find the focus;

Even the search to the request header to set x-frame-options This parameter point up, incidentally, x-frame-options this parameter:

Sometimes in order to prevent the page from being used by someone else's website iframe, we can set the HTTP header in the server x-frame-options information
There are three optional values for using x-frame-options:

Deny: The browser refuses the current page to load any frame page

The address of the Sameorigin:frame page can only be a page under a homologous domain name

Allow-from:origin the page address to allow frame loading

So if the value is set to deny, it does not show up frame, but it has no relationship with my present problem.

Okay, so much nonsense, now to tell, why the height of the IFRAME 100% will not be effective?

First of all, this is only a ie11 bug, in Ie11, in order to make the height of the iframe 100% effective, you must be sure that its parent element is also set height:100% and valid;

That is, the solution is to set the CSS style height:100% in the parent element of the IFRAME, and it is in effect, so that the height of the iframe 100% will naturally be good relative to their father;

Legend:

1, before

2. After

Finally, share the hope that everyone can not be the pit. What is wrong with the hope of the road to the great God, thank you!

About IFRAME in ie11 height:100% void of pit

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.