Safari Rendering Glitch

Just came across a case where Safari does a bad job rendering a page as expected. I am not sure if this was the same before Safari V 1.2

Assume the following css formatting:
a { text-decoration: underline; padding: 1px;}
a:link { color: #0078F0; }
a:visited { color: #0078F0; }
a:hover { color: #fff; background-color: #0078F0; text-decoration: none; }
a img {
border: none;
}

Then a page with content similar to this:

<a href="#">Link Title<br />
<img width="100" src="image.jpg" /></a>
<br />
<a href="#">Link Title<br />
<img width="100" src="image.jpg" /></a>
<br />

With this, Safari will apply the background color of the a:hover style also to the image which is inline the <a> tag. You'll notice the background being applied to the right and bottom of the image which looks real ugly.

IE5 Mac renders this much better. See below:

Safari	IE 5

Update: this seems to have been more a case of Safari not going into Quirks-Mode on my testcase and thus displaying the page as it did. The FIX for this is easy. Use: "display: block;" for the image tag (has side effects often unwanted) in your css or style="background-color:transparent; inline the a tag.

Me too
Since everybody has this nowadays, here#s my visited countries map:

create your own visited country map or write about it on the open travel guide

Update: the site generating these Map images seems to be terribly broken recently. For instance it displays a red stripe in southamerica if you enter CH (Swiss) as a visited country. Singapore takes almost all of Asia... Go figure.

Second Update: they just changed the querystring you need to pass to their server. Replaced colormap with worldmap as query sting.

And here's my Wife's:

create your own visited country map or write about it on the open travel guide