Font Color...

windows

Guest
Is there any way to force Opera to accept a color of "transparent" for fonts?

I have the following:

CSS
----------
p { background-color:#000; color:transparent; }

HTML
----------
<p>This is test</p>

All browsers except for Opera will render the text properly utilizing the "transparent" color, thus making the text "invisible".

Thanx.If it doesn't work then it probably isn't going to. You could try setting visibility:hidden; instead, but then the text couldn't be highlighted either...Yeah...that's the problem. Need to be able to highlight the text and/or apply an anchor to it.

Thanx.couldnt you just use color: #000?Yes, if the background was going to stay black.

I am going to be placing a background image and the text needs to be "invisible" on top of it.

Stupid Opera.

:rolleyes:I've set text to a simular color as the image they were going to be on and then set font size to 1pt. They appear as little dots but if you match the color close enough they dont show up. Used to do it to help with search engine hits heh.

does Opera accept 8 digit color codes? IE uses an extra 2 digits to set opacity. I havent really used it much, but might be worth exploring.Nah...

Far too many colors on background image to simply set the font to one color.

Thanx.No hacks or other such "clever" ways to accomplish this, eh?

Bummer.

Thanx.Cool!!!

Good ol' CSS comes through once again! I figured out a sneaky way around it.

Here's what I was working with:

===============================================
XHTML
----------
<li id="li12"><a href=http://www.webdeveloper.com/forum/archive/index.php/"images.xhtml" title="Shortcut to images...">Images</a></li>

CSS
----------
li#li12 a, li#li12 a:link, li#li12 a:visited { background:transparent url("button-normal.jpg") no-repeat 0% 0%; color:transparent; }
li#li12 a:hover { background:transparent url("button-raised.jpg") no-repeat 0% 0%; color:transparent; }
===============================================

Here's how I made it work:

===============================================
XHTML
----------
<li id="li12"><a href=http://www.webdeveloper.com/forum/archive/index.php/"images.xhtml" title="Shortcut to images..."><span class="hide">Images</span></a></li>

CSS (added)
----------
.hide { visibility:hidden; }
===============================================

So simple...can't believe I didn't think of it. Oh well, at least it validates now (color:transparent wasn't valid) and I'm getting the desired effect.
 
Back
Top