Translucent DIVs

[mars16]

Am trying to use <div> layers to implement my page design. I have got a text layer that over laps an image. I want the text area to be translucent in order to show through the image below. So far i have used the following css code for the text area:

<div id=textArea style="position:absolute; left:100px; top:100px; width:300px; height:300px; background-color:#ffffff; z-index:3; filter:alpha(Opacity=50);">

It does the job BUT the text it self becomes faded too. How can I aviod this?

[Robin_reala]

Well, the ideal way would be to use CSS3 rgba colours for the background but as no browser apart from Safari currently implements this you'll have to settle for second best by tiling an 1x1 alpha-translucent PNG as a background image. IEs less than 7 still don't support this natively but as they're alone in this you can get by with a single hack.

Documentation on how to use alphaImageLoader is on MSDN:

[msdn.microsoft.com ]

You can use sizingMethod=scale to simulate tiling the background-image in other browsers.