Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

PNG as Background Images 1

Status
Not open for further replies.

HisMightiness

Programmer
Mar 17, 2004
54
US
I have a site where we want to use PNGs for background images on various TDs and DIVs. We also use them as standalone images and for buttons. However, we have scoured the Internet for fixes that will specifically address the use of PNGs as background images for TDs and DIVs, but none seem to work. Here are a couple examples of what I have tried (without luck):

First that didn't work:

Second that didn't work (pretty much the same thing):

(pretty good!)

(very similar)

Will
 
Unless your PNG images are transparent, the images will normally work. The only problem is IE 6 does not support transparent PNGs I believe IE7 now supports them. But all other browsers support them just fine.

However if you are using it as a background I don't think they would need to be transparent.

In any case, you could also, use CSS conditional statements, and deliver PNG's to anything but IE6, which would require gifs.

Example:

Code:
load stylsheet for all borwsers here, 
[blue]<!--[if IE 6]>[/blue]
load style sheet with gifs instead of PNGs for IE6.  This should then override the previous stylesheet.
[blue]<![endif]-->[/blue]



----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Is there something inherently wrong with having a conditional statement that decides what [red]CSS[/red] style sheet to load?


There are only so many options, to get IE6 to use transparent PNGs correctly. If non work, than the only other option is to USE Gifs instead.

What kind of solution do you want exactly? since you have said than none of them are what you are looking for?




----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
What would be an option is what I'm getting at?

You listed a few methods that don't work, but you haven't actually explained what kind of method you are looking for. Maybe if you tell us why they won't work for you we can provide something that could work for you.

But just saying "this method doesn't work for me" makes things a little hard.

Perhaps you want something you can code exclusively inside a CSS style sheet? I'm sorry to tell you, but i know of no such method.

Perhaps something like this might work for you:

or this:





----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top