45

So i have this iFrame with the class .transparentbg:

.transparantbg{
    background-color: transparent;
}

This works fine in Chrome, but not in IE...

Help please?

Greetings

Hussein
  • 42,480
  • 25
  • 113
  • 143
Thew
  • 15,789
  • 18
  • 59
  • 100
  • possible duplicate of [iframe background image showing fine in Firefox but not in IE](http://stackoverflow.com/questions/2056302/iframe-background-image-showing-fine-in-firefox-but-not-in-ie) – Pekka Feb 27 '11 at 15:22

1 Answers1

107

Add allowTransparency="true" to your iframe

<IFRAME ID="Frame1" SRC="whatever.htm" allowTransparency="true">

For whatever.htm add background:transparent to its body tag.

<body style="background:transparent">
Steve Wortham
  • 21,740
  • 5
  • 68
  • 90
Hussein
  • 42,480
  • 25
  • 113
  • 143
  • 3
    great! this works perfectly for IE8 but i'm still having problems with IE7 its still showing a white background in place of transparent any ideas.??... – pranky64 Mar 15 '12 at 06:33
  • 14
    Yes, live with the fact that a very small percentage of your users will see a white background instead of a transparent one. – Han Dijk Jun 27 '12 at 12:45
  • 2
    ah, after two days, i found this solution. many many many thanks to both you guys – Wasim A. Oct 08 '12 at 22:33
  • If anyone is seeing further issues, I'm finding that in IE8, when an existing iframe changes it's source, the html tag within it must be styled as well. – cage rattler Feb 28 '14 at 19:41
  • appears IE9 doesn't require the `allowTransparency="true"` part. – bbodenmiller May 13 '14 at 22:52