How to make background image transparent

transparency

[fendy]

I have just a small tile that I set to background-repeat:repeat; and I tried with gif amd png

With gif the transparency works but the text is also transparent above the image

this is the div where I include the backgorund image

.node {
padding-top: 15;
padding-right: 0px;
padding-bottom: 15;
padding-left: 0;
background-image:url(images/nodebackground.png);
background-repeat:repeat;
float:left;filter:alpha(opacity=25);-moz-opacity:.25;opacity:.25;
filter: Alpha(Opacity=25;
}

So can somebody explain how to make it transparent, but only the image not the text - does it work with png or gif?

thanks

[Fotiman]

You can't set only the background image to be transparent (via opacity). Setting opacity will apply to the entire node, including background and foreground.

[Marshall]

The best thing you can do is lighten the picture part of the image in some photo program and leave the text as dark as you want. If you are using a .png image, be aware that IE6 makes transparent areas grey. So if you can, have a background color in the image even if it is white.

Marshall

[fendy]

Just as I though so, too bad it does not work

It does not work even with 50% opacity of gif?

Is that true

[D_Blackwell]

As Marshall indicated, using an image editing program and reducing the opacity should allow you to 'lighten' the image to any degree that you like, and that darker text should lay right over top very nicely.

I usually use (or convert) .jpgs (.png are not ready for 'prime time' yet). Don't use a lot of .gifs when working with my own images. What is the background color of the .gif - does it have one or is it fully transparent already? I would suggest continuing to practice and work with various options.