transparency

[Bluemonkey]

can i set the transearency of a input using the style tag? or sometihing simular so the back ground behind the input shows through??

thank for the help

[Bosko]

background: transparent;

And you mean 'transparency',right :)

[Bluemonkey]

thanks for the help and the spell checking

[select sires]

sorry to bring back a dead topic, but, I had trouble searching for transparency - if I do this, but want it to be only, 80% transparent, how would I add that?

THanks.

[MotherNatrsSon]

Originally posted by select sires
sorry to bring back a dead topic, but, I had trouble searching for transparency - if I do this, but want it to be only, 80% transparent, how would I add that?

THanks.

I think the style you would use would be opacity but I do not know what browsers it actually works in.

filter:alpha(opacity=20)

MNS

[wickford]

filter:alpha(opacity=20) works in Internet Explorer.

This will work in Mozilla and Netscape:
-moz-opacity:0.2

[select sires]

Thanks a lot.

The filter:alpha(opacity=20) works great, but when placed in the
#content div the whole div is made transparent,what would I add to just make the background color transparent?

[MotherNatrsSon]

Originally posted by select sires
Thanks a lot.

The filter:alpha(opacity=20) works great, but when placed in the
#content div the whole div is made transparent,what would I add to just make the background color transparent?

background-color: transparent

Check out this link:

http://www.w3schools.com/css/css_reference.asp

MNS

[brothercake]

You can use a translucent PNG as a background image

[kansel]

I had a problem with this myself: A large div with background color but also with content. Turn on opacity on the div and the content gets opacity as well, even nested elements will get opacity. My workaround is probably not standard but I nested the content in another div and gave that an opacity of 200%... I got mixed results, but my background opacity was only 75 so it's not that big of a deal, the content is still readable.

If possible, you might try absolutely positioning the background-colored div behind your content so the opacity doesn't affect the content.

I did try the PNG option. My biggest problem with that is limited browser support. When I tried it, only Mozilla/NS6 could see the alpha channel. Using dual IE/Moz opacity renders in both IE and Moz for PC and Mozilla for Mac (but not IE/Mac).

Another solution I tried is kind of a fake-translucent background. In the inner div I used a background GIF with a patter of alternating transparent and opaque pixels like this
# # # # #
# # # # #
# # # # #
# # # # #
But depending on what's behind it, the text may become unreadable.

(If you're interested in seeing how my workaround works the page is at kansel.homeip.net:81 (http://kansel.homeip.net:81/) and the CSS is at kansel.homeip.net:81/includes/styles/ganymede.css (http://kansel.homeip.net:81/includes/styles/ganymede.css)
look for IDs inner_box and info_area)

[brothercake]

Alpha channel transparency is natively support in gecko browsers, opera 7 and safari/konqueror.

It can work in win/ie5.5 and ie6 if you apply it using this filter:

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png',sizingMethod='scale');