SiteCrafting Blah Blah Blog

Mar. 16, 2007 at 10:48am

Safari and PNG Headaches

I just finished coding a new photography contest application for a client, and our graphic designer alerted me to some weirdness that Safari has with PNG images. To make a long story quite short, Safari doesn't translate PNG colors to match CSS colors reliably; it darkens them just a bit. The details are beyond me, so instead check out this article for those, and you can see an example in this image. The example labeled "Your Version" is the Safari rendering, and the box labeled "Our Version" is the Firefox rendering.

For you, this means that you shouldn't use PNG images where color matching is important, use GIF instead. However, if PNG use becomes more widespread, hopefully the treatment of PNG images by browsers and OSs will become more standard and can replace GIFs - which have fewer colors and larger filesizes.

Comments (4) | Posted in Browser Bugs, CSS, Design by Dave Poole


Dec. 13, 2006 at 4:12pm

The <select> Tag and innerHTML

While I was working on a recent project, I ran into a weird bug with IE 6. I was using some AJAX to dynamically fill a <select> tag with options depending on what element was selected from the tag's parent. It worked fine, and quite seamlessly in Firefox, but broke for inexplicable reasons in IE. Read more

Comments (6) | Posted in Browser Bugs, Javascript, PHP by Dave Poole


Oct. 9, 2006 at 11:31am

Strange Behavior with Opera 9 and Safari

While I was working on the latest site for Airstream, I came on some extremely weird behavior concerning the navigation. First off, the designers did an extremely good job with the visuals. On the other hand, I had to be really creative to figure out how to make various parts of the site work.

Here's some background for how the navigation was supposed to work: there are five sections to the site, and each section has sub sections that show up in the navigation bar, depending on what your current location is. Navigation and sub-navigation. Also, the navigation area has a graphical background that can't change. Since the PNG spec isn't fully supported by IE yet, we had to go with GIF or JPG graphics.

Here's what it is supposed to look like (and what we ended up with):

Airstream - Intended

Read more

Comments (0) | Posted in Browser Bugs, CSS by Dave Poole