HTML Image Trasparency

I've been developing a new drupal site recently and I came across the following problem:

The font of the logo of the site is not a web font and I didn't want to change the CSS and have the users' browsers download the font, so I created an image with the font (I know this is not what I should have done because of SEO).

When I uploaded the image to the site I noticed that the background color of the header (where the image is) is set to be fading... I had set the background color on the image but there was a problem because of the effect.

I thought that I may solve the problem by turning the background of the image to transparent and so I did.

When I uploaded the new image on the site the result was not what I was hopping for... The transparent part of the image was converted to white.

After searching the web for a while I discovered that you have to save the image file as PNG or GIF in order to use the transparency of the image file.

So I fired up Photoshop again and tried to save the file as PNG but the option was not available on the 'Save As' dialog. I used 'Save for Web', saved the file as PNG and uploaded it. It worked like a charm!!!

Popular posts from this blog

Domain Controller Machine Password Reset

Configuring a Certificate on Exchange Receive Connector

Running Multiple NGINX Ingress Controllers in AKS