Prosilver alt text overlaps 'post new topic' button image

[MsIrey]

How to remove text overlapping the image?

overlap.png (17.61 KiB) Viewed 595 times

I have been trying to change the post new topic button image (and post reply) over and over and keep getting the same result. Instead of seeing just the new image, I also see the alt text with it. I don't want to see the alt text. I finally reverted to the original post reply button so that I just had to focus on one button as shown in the screen shot.

My new image is a png vs. the original gif and I have edited (using gedit in sftp) the imageset/en/imageset.cfg file to show

Code: Select all

img_button_topic_new = button_topic_new_004.png*25*96

I've refreshed all three style components for prosilver in the ACP and purged the cache as well as refreshed the browser.

In summary, the only two changes I've made was to add the new png to the imageset/en/folder and edited the imageset/en/imageset.cfg file. Is there something else I am overlooking?

[MsIrey]

Changed the png to a jpg in GIMP. That got rid of the transparency of the image giving it a white background. Works fine now.

[Arty]

Add this to colours.css

Code: Select all

.buttons div span { background-color: #fff; }

[MsIrey]

Do that now that I have it fixed?

Do you mean that whenever I use a png, by inserting that line in colors.css, I'll avoid the problem to begin with?

[Arty]

If you want your buttons to look better, yes. Undo your png -> jpg change and add that one line.

You didn't have to change format to JPEG to get rid of transparency. JPEG format is great for large pictures, but for buttons its rather bad because you have a choice of loss of quality or large file. PNG buttons are smaller without loss of quality.

All you had to do was to add white background to it. It could be done by editing images or by adding that one line to colors.css

[MsIrey]

"I see," said the blind man, LOL! Thank you for that tip!