Share via

iframe is transparent in Edge,chrome and works fine on IE

nash Red 1 Reputation point
2022-06-15T17:48:46.733+00:00

We started using Microsoft Edge Version 102.0.1245.41 (Official build) (64-bit) Iframe on edge is transparent
211811-capture.jpg

But the same code when used in IE works fine
211802-111.jpg

Iframe-

<IFRAME id=detailsIFrame style="BORDER-TOP: #000000 2px solid; HEIGHT: 500px; BORDER-RIGHT: #000000 2px solid; WIDTH: 900px; BORDER-BOTTOM: #000000 2px solid; POSITION: absolute; LEFT: 499px; BORDER-LEFT: #000000 2px solid; Z-INDEX: 10; TOP: 25px" height=456 src="individualExtras.htm?key=143000&keyType=PAYOR" frameBorder=0 width=900;scrolling=no></IFRAME>

Microsoft Edge | Microsoft Edge development

1 answer

Sort by: Most helpful
Most helpful Newest Oldest
  1. Anonymous
    2022-06-17T08:07:11.33+00:00

    Hi @nash Red

    I have tested on my device, and found that if the attribute "background-color" of the page embedded in the iframe has not been set, you will have a transparent iframe by default. There's an attribute exclusive to IE called "allowtransparency", whose value is set to "false" by default. So you may have a white background in IE, but a transparent one in Edge/Chrome.

    In short, I would suggest setting the background color of the embedded page to a particular color to avoid transparency in iframe. You can have a try and tell us the result.

    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    Regards,
    Yu Zhou

    1 person found this answer helpful.

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.