semitransparent div

am 18.05.2007 02:34:48 von clqrq

id like to have the following:

test

with the div having background #000000 and the text having color
#ff0000, so

div {background-color:#000000;}
p {color:#ff0000;}

now the problem:

i want to have the div semitransparent like this...
div {
background-color:#000000;
filter:alpha(opacity=77); -moz-opacity:0.77;
opacity:0.77; -khtml-opacity:0.77;
}

but i want to have the text at opacity 100%.

any ideas?

thx for any thoughts, .rhavin;)

Re: semitransparent div

am 18.05.2007 03:34:03 von lws4art

..rhavin grobert wrote:
> id like to have the following:
>
>

test

>
> with the div having background #000000 and the text having color
> #ff0000, so
>
> div {background-color:#000000;}
> p {color:#ff0000;}
>
> now the problem:
>
> i want to have the div semitransparent like this...
> div {
> background-color:#000000;
> filter:alpha(opacity=77); -moz-opacity:0.77;
> opacity:0.77; -khtml-opacity:0.77;
> }
>
> but i want to have the text at opacity 100%.
>
> any ideas?
>

You can't directly on the same DIV you have to use a transparent
background image for the DIV. Note MSIE<7 PNG transparency limitations.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

Re: semitransparent div

am 18.05.2007 04:48:29 von Neredbojias

On Fri, 18 May 2007 00:34:48 GMT .rhavin grobert scribed:

> id like to have the following:
>
>

test

>
> with the div having background #000000 and the text having color
> #ff0000, so
>
> div {background-color:#000000;}
> p {color:#ff0000;}
>
> now the problem:
>
> i want to have the div semitransparent like this...
> div {
> background-color:#000000;
> filter:alpha(opacity=77); -moz-opacity:0.77;
> opacity:0.77; -khtml-opacity:0.77;
> }
>
> but i want to have the text at opacity 100%.
>
> any ideas?

I goofed around with this a few months back and the only thing I got to
work was layering.

--
Neredbojias
He who laughs last sounds like an idiot.

Re: semitransparent div

am 18.05.2007 09:15:11 von Ben C

On 2007-05-18, .rhavin grobert wrote:
> id like to have the following:
>
>

test

>
> with the div having background #000000 and the text having color
> #ff0000, so
>
> div {background-color:#000000;}
> p {color:#ff0000;}
>
> now the problem:
>
> i want to have the div semitransparent like this...
> div {
> background-color:#000000;
> filter:alpha(opacity=77); -moz-opacity:0.77;
> opacity:0.77; -khtml-opacity:0.77;
> }
>
> but i want to have the text at opacity 100%.
>
> any ideas?
>
> thx for any thoughts, .rhavin;)

You need the text in a different element that's not a descendent of the
semi-transparent one, but stacked on top of it. z-index and position:
absolute can be used to achieve this.

See
http://groups.google.co.uk/group/comp.infosystems.www.author ing.stylesheets/browse_thread/thread/daf8300d45a25721/2c7cdc f4107b8d95?hl=en#2c7cdcf4107b8d95

Re: semitransparent div

am 18.05.2007 10:09:04 von Toby A Inkster

..rhavin grobert wrote:

> i want to have the div semitransparent like this...
> div {
> background-color:#000000;
> filter:alpha(opacity=77); -moz-opacity:0.77;
> opacity:0.77; -khtml-opacity:0.77;
> }
> but i want to have the text at opacity 100%.

Don't set any opacity -- leave it at 100%. Set background-color to
"transparent" and add an alpha-blended PNG background image.

--
Toby A Inkster BSc (Hons) ARCS
http://tobyinkster.co.uk/
Geek of ~ HTML/SQL/Perl/PHP/Python/Apache/Linux