there is no attribute "allowtransparency"

Question

I am looking for some alternate way to do:

<iframe transparency=true   ...

When i do the w3c validation, I am getting the error:

Column 31: there is no attribute "allowtransparency"

Hi

if use this css

.iframe-trans-fix{
   opacity: 0;
   filter:alpha(opacity=0);
}

for above snippet am getting blank iframe,

Answer 1

I'm not sure what you're trying to do here, but this should be what you are looking for:

iframe {
    background-color: transparent;
}

This is, of course, assuming that you want the background to the iframe be transparent.

Answer 2

1. There is no HTML attribute named transparency, so you will always get an error with iframe transparency=true

2. if you set opacity to zero, you won't see the element at all - you need to define the degree of opacity:

   opacity: 0.25; /* all modern browsers / filter: alpha(opacity=25) / IE */

The above CSS (note: opacity values are 0-100 for IE, 0-1 for other browsers) will allow other elements behind (e.g. a page background image) to show through, even if the element with the opacity setting has a coloured background.

For more control over transparency, see RGBA (A = alpha), but watch out for variable browser support.

Answer 3

First, there is no such thing as 'transparency="true"', so that won't work.

Second, are you trying to make the background transparent or the entire iframe transparent?

The CSS Opacity property makes everything inside whatever element you use it on transparent. Opacity scales from 0 to 1, where 0 is completely see-through, 0.5 is half transparent, and 1 is completely visible.

If you use this on a div or an iframe (or anything) the background and the text will all be equally faded.

On the other hand, in every modern browser you can set the backround to be partially transparent using RGBA color. You should do it like this:

iframe.transparent {
    background-color: #FFF; /*this gives a background color for browsers that can't do RGBA color, like internet explorer*/
    background-color: rgba(255,255,255,0.5);
}

The RGBA color definition works just like the opacity attribute (0 = clear, 1 = solid), except it only makes the specific item you set it on transparent and does not affect the items inside that item (ie it does not affect the text inside your iframe). The first three numbers are the red, green, and blue values of your color on a scale from 0 to 255.

If you want a better cross-browser solution, though, I'd recommend just using a transparent .png file as a background image. You'll have to test this on IE, not sure if it will work for an iframe specifically, but you could set no background on the iframe and then set the transparent image as the background of the page you load inside the iframe (apply it to the body element for that page).

Hope this helps!