Skip to content


Web Tutorial: Internet Explorer (IE) iframe

I recently ran into a problem while trying to add an iframe with a transparent background in IE. CSS didn’t seem to apply to the iframe when I was working with it (at least not very well). What we’ll be fixing:

  1. Allowing a background to be set with CSS or a transparent background
  2. Removing borders from around the iframe (they look like crap)

The Background

In Internet Explorer, if you try to add a background (or have a transparent background) with your page’s CSS it doesn’t work. Instead, it keeps a white, boring background from the iframe (assuming the iframe has no background set). This little code will fix this problem, allowing transparent or colored backgrounds to be set through CSS.

Inside of your <body> tag in the HTML of the iframe, set the background style to “inherit” (<body style=”background:inherit;”>) and you can have a background using CSS from your page. It’s that simple.

Note: If you are making a transparent background, you need to add allowtransparency=”true” to the <iframe> tag as one of its attributes.

Note: If you want to make this iframe of a page that you cannot edit, look into using PHP to modify the <body> tag.

The Border

This one is just as simple, and can be done straight from the HTML. Add to the <iframe>’s attributes the following: frameborder=”0″

Posted in Web Tutorials.


7 Responses

Stay in touch with the conversation, subscribe to the RSS feed for comments on this post.

  1. Tom says

    Out of interest, why are you still using iFrames? What do you use them for?

  2. Zane Hooper says

    It was used for a frame that loaded a graph created through JavaScript, which was updated when the user submitted a form to be the graph reloaded (it was a poll). It would have been possible to reload it through JavaScript but much harder.

  3. Jean Mashiah says

    greetings, impressi ve blog on jobs. akin helped.

  4. Vinyl Banners says

    I do not even know how I ended up here, but I thought this post was good. I don’t know who you are but certainly you are going to a famous blogger if you aren’t already ;) Cheers!

  5. trivago says

    Whats up, I want to ask you something. Is this site a wordpress web log? I am considering transferring our blog site from Blogger to wordpress, you think that is probable? Also did you design this specific template yourself some how? Cheers for your assistance!

  6. trivago says

    Hey there, I need to ask you one thing. Is this site a wordpress webpage? I am pondering changing my blog from Blogger to wordpress, you think this can be possible? In addition did you create this template yourself some how? Bless you for the assistance!

  7. Zane Hooper says

    I used an online one called Display, although I can’t remember where I got it. Thanks for the visit, and sorry for the late reply.



Some HTML is OK

or, reply to this post via trackback.